Imgur api ajax : No image data was sent to the api

Question

I am trying to upload image to imgur through ajax. I am using base64 encoded image. Its showing that no data was sent even though i can see the base64 data in the console .

The error i get is :-

{"data":{"error":"No image data was sent to the upload api","request":"\/3\/image","method":"POST"},"success":false,"status":400}

Should replace "data/jpeg" or "data/png" with blank string ??

My code :-

$(document).ready(function(){

function upload_to_imgur(img)
{   
      // $('body').text(img) ;
      var data = new FormData() ;
      data.append("image",img) ;

      $.ajax({
        url: "https://api.imgur.com/3/image",
        type: "POST",
        headers: {
          "Authorization": "Client-ID a867bb291ca25d3" ,
        },
        dataType:"json" ,
        contentType : "multipart/form-data;boundary=----WebKitFormBoundary7MA4YWxkTrZu0gW",
        processData:false,
        data :data,
        success: function(response) {
          var photo = response.data.link;
          $('body').text(photo) ;
        }
      });
}

function base64_image(img)
{
    var reader = new FileReader() ;
    reader.onload = function(e){
        base64data = e.target.result ;
        upload_to_imgur(base64data) ;
    }
    reader.readAsDataURL(img)
}

$('#submit_button').click(function(){

    upload_to_imgur(document.getElementById('p_img_link1').files[0])

    query_string = " \
                INSERT INTO `cm_db_mg`.`products` (`p_list_img`, `p_img_link_1`, `p_img_link_2`, `p_title`, `p_c_s_id`, `p_description`, `p_tags`, `p_listPrice`, `p_mrp`, `p_publishStatus`, `p_publishType`, `p_sem`, `p_s_id`, `p_b_id`, `p_c_id`, `p_u_id_seller`, `p_cat_uniq`, `p_not_listed_cmnt`, `p_disclaimer`, `p_condition`, `p_return_allowed`, `created`, `updated`) \
                VALUES ('', '', 'te', '', NULL, '', '', '', '-1', '', '', NULL, NULL, NULL, NULL, NULL, NULL, NULL, '', 'First Hand', 'F', '', '');"


}) ;

}) ;

score 1 · Accepted Answer · answered Jun 08 '17 at 16:00

1

function upl_im(t) {
    var file = t.files[0];
    var fd = new FormData();
    fd.append("image", file);
    var xhr = new XMLHttpRequest();
    xhr.open("POST", "https://api.imgur.com/3/image.json");
    xhr.onload = function() {
        var link_src=JSON.parse(xhr.responseText).data.link;
        document.getElementById('res').style.backgroundImage = 'url('+link_src+')';
    }
   xhr.setRequestHeader('Authorization', 'Client-ID a867bb291ca25d3');        
    xhr.send(fd);
}

See

answered Jun 08 '17 at 16:00

Choo Hwan

416
3
12

Thanks !...but what is the difference between image.json and image ?? – Vivek Iyer Jun 08 '17 at 16:12
That file processes your post-request and returns a link to your file. – Choo Hwan Jun 08 '17 at 16:20
Okay. I asked it because as per imgur docs it just /image. And when i make an api call using php curl i got a response with just using the /image(i.e without using /image.json) . Any any idea how it happened ? Again thanks ! – Vivek Iyer Jun 08 '17 at 16:21
That's error. See at: https://stackoverflow.com/questions/37979073/upload-image-on-imgur-with-php – Choo Hwan Jun 08 '17 at 16:31

score 0 · Answer 2 · answered Dec 10 '17 at 15:42

Basically I had the same problem but I struggled when using PHP to upload some data to the imgur server. I was able to see the evidently POSTed data on my server, but the imgur api responded too with no image data was sent to the upload api.

It worked with standalone curl and from Fiddler, but not manually from my server. In the end the problem was, that I was manually creating the POST headers and writing those manually to the opened socket. Because of this I did not send the Content-Length header which caused the imgur api to just not read the POST body.

After I had noticed this, I manually calculated the data size and sent the Content-Length header. This made the imgur api working for me.

Imgur api ajax : No image data was sent to the api

2 Answers2