Uploading base64 image to Facebook graph API via Javascript/Phonegap

Question

I'm trying to make a "post" request to https://graph.facebook.com/"+userID+"/photos?access_token="+accessToken

with the 'url' paramter being a base64 data URI.

I got the error "data:base64.... is an interal URL but this is an external request".

I've been searching for this, too. The closest thing I can figure out is to save the image temporarily on your server, serve the image to a an album, and then delete the photo, since, once the image is on Facebook, the source image is no longer necessary. Looking forward to what others find, though. — Justin McCraw, May 13 '13 at 18:32
This one worked for me: http://facebook.stackoverflow.com/a/16439233/1472477 — Justin McCraw, May 14 '13 at 21:01

score 0 · Answer 1 · answered Aug 11 '14 at 13:44

I know the pain of not being able to upload a single photo. After sleepless nights and days of research, I finally got it to work with the cordova file-transfer plugin

This solution DOES NOT require Uint8Array or Blobs support ;)

First add the plugin: cordova plugin add org.apache.cordova.file-transfer

Then, use this code (Note that I am using angular.js. Either do not use promises or use a library like rsvp or Q to make your promises):

function postImage(fileURI, message) {

    var deferred = $q.defer();

    var win = function (r) {

        deferred.resolve(r);
    }

    var fail = function (error) {

        deferred.reject(error);
    }

    var options = new FileUploadOptions();
    options.fileKey = "file";
    options.fileName = 'name_of_photo_' + Math.round((+(new Date()) + Math.random()));
    options.mimeType = "image/jpg";

    var params = new Object();
    params.access_token = "your facebook access token ;)";
    params.message = message;
    params.no_story = false;

    options.params = params;

    var ft = new FileTransfer();
    ft.upload(fileURI, "https://graph.facebook.com/v2.0/me/photos", win, fail, options);

    return deferred.promise;
}

score -1 · Answer 2 · answered Aug 31 '13 at 14:56

  <script src='http://connect.facebook.net/en_US/all.js'></script>
 FB.init({appId: "ur ap id of fb", status: true, cookie: true});
FB.login(function(response) {
       if (response.authResponse) {
         var access_token =   FB.getAuthResponse()['accessToken'];
         FB.api('me/photos', 'post', {
             message: 'posted by xxxx',
             status: 'success',
             access_token: access_token,
             url: 'test.png'
         }, function (response) {

             if (!response || response.error) {
                alert('Error occured');
             } else {
                 alert('Image Posted On Facebook');
             }

         });
       } else {

       }
     }, {scope: 'user_photos,photo_upload,publish_stream,offline_access'});

        },
        error:function(){

        }

Uploading base64 image to Facebook graph API via Javascript/Phonegap

2 Answers2