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', '', '');"


}) ;

}) ;

Answer 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