Facebook photo upload with JavaScript is not working

Question

I need to write a javascript code for construct 2 plugin. below is my code :

Acts.prototype.PublishToWallPHOTO = function (snapshotdata)
 {
  if (this.runtime.isDomFree || !fbLoggedIn)
   return;  
var blob; 
  try
  {
 blob = dataURItoBlob(snapshotdata.replace("data:image/png;base64,", ""),'image/png');
         }
  catch(e){console.log(e);}
   
  
  FB.api('/me/photos', 'POST', {
        message:'photo description',
        source:blob        
    }, function(response) {
 if (!response || response.error)
  console.error(response);
   });
 };
 
 
function dataURItoBlob(dataURI,mime)
{
     var byteString = window.atob(dataURI);
     var ia = new Uint8Array(byteString.length);
     for (var i = 0; i < byteString.length; i++) {
     ia[i] = byteString.charCodeAt(i);
     }
     var blob = new Blob([ia], { type: mime });
     return blob;
}

for above code parameter for "snapshotdata" look like this : "data:image/png;base64,iVBORw0KGgoAAAA.........."

But my image was not uploaded to facebook using above code. but with same code if I use url:'http://example.com/abc.png' instead of source:blob then it upload a image in given URL successfully. I was tried to find the wrong with above code, but i was unable to find a proper solution. Please tell me if any one know the issue with above code.

ps: sorry for poor English

score 0 · Answer 1 · answered Mar 08 '15 at 19:32

Maybe a FormData() does the trick.

function uploadPicture(response) {
  if (response.status === 'connected') {

    var blob = dataURItoBlob(imageHolder.imageElement.dom.src.replace("data:image/png;base64,", ""),'image/png');
    var fd = new FormData();
    var token = response.authResponse.accessToken;

    fd.append("access_token",token);
    fd.append("source\"; filename=\"" + "test.png" + "\"", blob);
    fd.append("message","Test");
    try{
      $.ajax({
        url:"https://graph.facebook.com/me/photos?access_token=" + token,
        type:"POST",
        data:fd,
        processData:false,
        contentType:false,
        cache:false,
        success:function(data){
        console.log("success " + data);
      },
      error:function(shr,status,data){
        console.log("error " + data + " Status " + shr.status);
      },
      complete:function(){
        console.log("Ajax Complete");
      }
    });
    }catch(e){console.log(e);}
  }
}

Facebook photo upload with JavaScript is not working

1 Answers1