如何在 firefox 插件中使用 Javascript 将图像上传到 ImgBB API

How to upload an image to ImgBB API using Javascript in a firefox addon(如何在 firefox 插件中使用 Javascript 将图像上传到 ImgBB API)
本文介绍了如何在 firefox 插件中使用 Javascript 将图像上传到 ImgBB API的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着跟版网的小编来一起学习吧!

问题描述

限时送ChatGPT账号..

可以在

解决方案

小米应用也是同样的问题.

创建

代码 javascript

函数fileChange(){var file = document.getElementById('input_img');var form = new FormData();form.append("图片", file.files[0])变量设置 = {"url": "https://api.imgbb.com/1/upload?key=8d5867a9512390fb5e5dc97839aa36f6",方法":发布",超时":0,过程数据":假,"mimeType": "multipart/form-data",内容类型":假,数据":表格};$.ajax(settings).done(function (response) {控制台日志(响应);var jx = JSON.parse(响应);控制台.log(jx.data.url);});

}

这对我有用

Info on the API can be found here. It does not give any details for using with Javascript, only with curl.

Have tried numerous different methods from old posts on here but this is the closest I have got so far.

function main() {
    var ul = document.querySelector('.redactor_toolbar')

    if(ul != null)
    {
        var new_li = document.createElement('li')
        var new_a = document.createElement('a')
        new_li.appendChild(new_a)
        ul.appendChild(new_li)

        new_a.addEventListener('click', function() {
            var input = document.createElement('input');
            input.type = 'file';

            input.onchange = e => {
                uploadImage(e.target.files[0])
            }

            input.click();
        })
    }
 }

 async function uploadImage(img)
 {
    var form = new FormData();
    form.append('image', img)

    var url = 'https://api.imgbb.com/1/upload?key=8d5867a9512390fb5e5dc97839aa36f6' 

    const config = {
        method: 'POST',
        headers: {
            'Accept': 'application/json',
            'Access-Control-Allow-Origin': '*',
            'Connection': 'keep-alive',
            'Content-Type': 'application/json',
        },
        body: form
    }

    const response = await fetch(url, config)
    const json = await response.json()

    console.log(response)
 }

The JSON response:

解决方案

is the same problem for mi application.

Create

<input type="file" id="input_img" onchange="fileChange()" accept="image/*">

The code javascript

function fileChange(){
var file = document.getElementById('input_img');
var form = new FormData();
form.append("image", file.files[0])

var settings = {
  "url": "https://api.imgbb.com/1/upload?key=8d5867a9512390fb5e5dc97839aa36f6",
  "method": "POST",
  "timeout": 0,
  "processData": false,
  "mimeType": "multipart/form-data",
  "contentType": false,
  "data": form
};


$.ajax(settings).done(function (response) {
  console.log(response);
  var jx = JSON.parse(response);
  console.log(jx.data.url);


});

}

This work for me

这篇关于如何在 firefox 插件中使用 Javascript 将图像上传到 ImgBB API的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持跟版网!

本站部分内容来源互联网,如果有图片或者内容侵犯了您的权益,请联系我们,我们会在确认后第一时间进行删除!

相关文档推荐

SCRIPT5: Access is denied in IE9 on xmlhttprequest(SCRIPT5:在 IE9 中对 xmlhttprequest 的访问被拒绝)
XMLHttpRequest module not defined/found(XMLHttpRequest 模块未定义/未找到)
Show a progress bar for downloading files using XHR2/AJAX(显示使用 XHR2/AJAX 下载文件的进度条)
How can I open a JSON file in JavaScript without jQuery?(如何在没有 jQuery 的情况下在 JavaScript 中打开 JSON 文件?)
How do I get the HTTP status code with jQuery?(如何使用 jQuery 获取 HTTP 状态码?)
quot;Origin null is not allowed by Access-Control-Allow-Originquot; in Chrome. Why?(“Access-Control-Allow-Origin 不允许 Origin null在铬.为什么?)