简体   繁体   中英

How to upload an image to ImgBB API using Javascript in a firefox addon

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

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM