Tak, jest to możliwe, znajduję 2 rozwiązania, jak to zrobić i są bardzo podobne do siebie, trzeba po prostu zdefiniować parametr url do zewnętrznego adresu URL obrazu

Pierwszy przy użyciu Javascript SDk:

var imgURL="http://farm4.staticflickr.com/3332/3451193407_b7f047f4b4_o.jpg";//change with your external photo url
FB.api('/album_id/photos', 'post', {
    message:'photo description',
    url:imgURL        
}, function(response){

    if (!response || response.error) {
        alert('Error occured');
    } else {
        alert('Post ID: ' + response.id);
    }

});

I drugi przy użyciu jQuery POST request i FormData:

 var postMSG="Your message";
 var url='https://graph.facebook.com/albumID/photos?access_token='+accessToken+"&message="+postMSG;
 var imgURL="http://farm4.staticflickr.com/3332/3451193407_b7f047f4b4_o.jpg";//change with your external photo url
 var formData = new FormData();
 formData.append("url",imgURL);

  $.ajax({
                    url: url,
                    data: formData,
                    cache: false,
                    contentType: false,
                    processData: false,
                    type: 'POST',

                    success: function(data){
                        alert("POST SUCCESSFUL");
                    }
                });

Użyłem kodu @Владимир Дворник z jakąś modyfikacją, miałem ten sam problem i z tym kodem działało bardzo dobrze:

        var imgURL = //your external photo url
        FB.api('/photos', 'post', {
            message: 'photo description',
            access_token: your accesstoken 
            url: imgURL
        }, function (response) {

            if (!response || response.error) {
                alert('Error occured:' + response);
            } else {
                alert('Post ID: ' + response.id);
            }

        });

Zdjęcia mogą być przesyłane do profilu facebook za pomocą Ajax w następujący sposób.

$.ajax({
            type: "POST",
            url: "https://graph.facebook.com/me/photos",
            data: {
                message: "Your Msg Goes Here",
                url: "http://www.knoje.com/images/photo.jpg[Replace with yours]",
                access_token: token,
                format: "json"
            },
            success: function(data){
               alert("POST SUCCESSFUL"); }
            });

Więc jest to najlepszy sposób, aby umieścić zdjęcie na profilu facebook z Graph API i jest prosty.

W wielu odpowiedziach widziałem, że URL obrazu jest shwon przez źródło, obraz lub obraz itp, ale to nie działa.

Użycie źródła,obrazu lub obrazu prowadzi do błędu (#324) wymaga przesłania pliku .

Najlepszy sposób na uniknięcie błędu 324.

Tylko odpowiedź @Thiago odpowiada na pytanie wgrywanie danych przez javascript. Odkryłem, że Facebook JS API nie obejmuje tej sytuacji.

Zaparzyłem i przetestowałem moje rozwiązanie personl.

Główne kroki

Nie jest to jednak możliwe, ponieważ nie jest to możliwe, ponieważ nie jest to możliwe.]} Aby uzyskać więcej informacji, skontaktuj się z nami, aby uzyskać więcej informacji]}
1. Dołącz dane binarne do request
2. Zakoduj wszystko w tablicy binarnej i wyślij to przez XHR

Kod

Narzędzia konwersji

var conversions = {
  stringToBinaryArray: function(string) {
    return Array.prototype.map.call(string, function(c) {
      return c.charCodeAt(0) & 0xff;
    });
  },
  base64ToString: function(b64String) {
    return atob(b64String);
  }
};

Fragment zamieszczania zdjęć

var DEFAULT_CALL_OPTS = {
  url: 'https://graph.facebook.com/me/photos',
  type: 'POST',
  cache: false,
  success: function(response) {
    console.log(response);
  },
  error: function() {
    console.error(arguments);
  },
  // we compose the data manually, thus
  processData: false,
  /**
   *  Override the default send method to send the data in binary form
   */
  xhr: function() {
    var xhr = $.ajaxSettings.xhr();
    xhr.send = function(string) {
      var bytes = conversions.stringToBinaryArray(string);
      XMLHttpRequest.prototype.send.call(this, new Uint8Array(bytes).buffer);
    };
    return xhr;
  }
};
/**
 * It composes the multipart POST data, according to HTTP standards
 */
var composeMultipartData = function(fields, boundary) {
  var data = '';
  $.each(fields, function(key, value) {
    data += '--' + boundary + '\r\n';

    if (value.dataString) { // file upload
      data += 'Content-Disposition: form-data; name=\'' + key + '\'; ' +
        'filename=\'' + value.name + '\'\r\n';
      data += 'Content-Type: ' + value.type + '\r\n\r\n';
      data += value.dataString + '\r\n';
    } else {
      data += 'Content-Disposition: form-data; name=\'' + key + '\';' +
        '\r\n\r\n';
      data += value + '\r\n';
    }
  });
  data += '--' + boundary + '--';
  return data;
};

/**
 * It sets the multipart form data & contentType
 */
var setupData = function(callObj, opts) {
  // custom separator for the data
  var boundary = 'Awesome field separator ' + Math.random();

  // set the data
  callObj.data = composeMultipartData(opts.fb, boundary);

  // .. and content type
  callObj.contentType = 'multipart/form-data; boundary=' + boundary;
};

// the "public" method to be used
var postImage = function(opts) {

  // create the callObject by combining the defaults with the received ones
  var callObj = $.extend({}, DEFAULT_CALL_OPTS, opts.call);

  // append the access token to the url
  callObj.url += '?access_token=' + opts.fb.accessToken;

  // set the data to be sent in the post (callObj.data = *Magic*)
  setupData(callObj, opts);

  // POST the whole thing to the defined FB url
  $.ajax(callObj);
};

Użycie

postImage({
  fb: { // data to be sent to FB
    caption: caption,
    /* place any other API params you wish to send. Ex: place / tags etc.*/
    accessToken: 'ACCESS_TOKEN',
    file: {
      name: 'your-file-name.jpg',
      type: 'image/jpeg', // or png
      dataString: image // the string containing the binary data
    }
  },
  call: { // options of the $.ajax call
    url: 'https://graph.facebook.com/me/photos', // or replace *me* with albumid
    success: successCallbackFunction,
    error: errorCallbackFunction
  }
});

Extra

Wyodrębnianie reprezentacji ciągu binarnego obrazu płótna

var getImageToBeSentToFacebook = function() {
  // get the reference to the canvas
  var canvas = $('.some-canvas')[0];

  // extract its contents as a jpeg image
  var data = canvas.toDataURL('image/jpeg');

  // strip the base64 "header"
  data = data.replace(/^data:image\/(png|jpe?g);base64,/, '');

  // convert the base64 string to string containing the binary data
  return conversions.base64ToString(data);
}

Informacje jak załadować binaryString z input[type=file]

API plików HTML5 odczytywane jako tekstowe i binarne

Uwagi:

1. są oczywiście również alternatywne podejścia
   Nie można uzyskać odpowiedzi na wywołanie wywołania.]}
   • za pomocą FormData & File podejście, ale niestety w tym przypadku jest wiele niezgodności, które utrudniają korzystanie z procesu, a skończyłoby się to oklejaniem niekonsekwencji-dlatego moim wyborem był ręczny montaż danych, ponieważ standardy HTTP rzadko się zmieniają:) {]}
2. rozwiązanie nie wymaga wszelkie specjalne funkcje HTML5.
3. powyższy przykład wykorzystuje jQuery.ajax, jQuery.extend, jQuery.each

Tak, możesz to zrobić wysyłając dane do iframe jak Tutaj, lub możesz użyć jQuery plik Upload . Problem w tym, że nie można uzyskać odpowiedzi z iframe, za pomocą wtyczki można użyć uchwyt strony.

Przykład: Prześlij film używając pliku jQuery Upload

<form id="fileupload" action="https://graph-video.facebook.com/me/photos" method="POST" enctype="multipart/form-data">
    <input type="hidden" name="acess_token" value="user_acess_token">
    <input type="text" name="title">
    <input type="text" name="description">
    <input type="file" name="file"> <!-- name must be file -->
</form>


<script type="text/javascript">

    $('#fileupload').fileupload({
        dataType: 'json',
        forceIframeTransport: true, //force use iframe or will no work
        autoUpload : true,
        //facebook book response will be send as param
        //you can use this page to save video (Graph Api) object on database
        redirect : 'http://pathToYourServer?%s' 
    });
</script>

Aby przesłać plik z lokalnego komputera za pomocą Javascript, spróbuj HelloJS

<form onsubmit="upload();">
     <input type="file" name="file"/>
     <button type="submit">Submit</button>
</form>

<script>
function upload(){
   hello.api("facebook:/me/photos", 'post', document.getElementById('form'), function(r){
      alert(r&&!r.error?'Success':'Failed'); 
   });
}
</script>

Jest demo uploadu na http://adodson.com/hello.js/demos/upload.html

Https://stackoverflow.com/a/16439233/68210 zawiera rozwiązanie, które działa, jeśli chcesz przesłać dane Zdjęcia i nie masz adresu url.

To nadal działa. Używam go jak poniżej:

var formdata= new FormData();
if (postAs === 'page'){
    postTo = pageId; //post to page using pageID
}

formdata.append("access_token", accessToken); //append page access token if to post as page, uAuth|paAuth
formdata.append("message", photoDescription);
formdata.append("url", 'http://images/image.png');

try {
    $.ajax({
        url: 'https://graph.facebook.com/'+ postTo +'/photos',
        type: "POST",
        data: formdata,
        processData: false,
        contentType: false,
        cache: false,
        error: function (shr, status, data) {
            console.log("error " + data + " Status " + shr.status);
        },
        complete: function () {
            console.log("Successfully uploaded photo to Facebook");
        }
    });
} catch (e) {
    console.log(e);
}

Muszę jednak zapytać, czy ludzie mają pojęcie, czy jest to wskazane lub ma duże ryzyko bezpieczeństwa w porównaniu do korzystania z PHP api dla Facebook.

To działa:

   function x(authToken, filename, mimeType, imageData, message) {
    // this is the multipart/form-data boundary we'll use
    var boundary = '----ThisIsTheBoundary1234567890';

    // let's encode our image file, which is contained in the var
    var formData = '--' + boundary + '\r\n';
    formData += 'Content-Disposition: form-data; name="source"; filename="' + filename + '"\r\n';
    formData += 'Content-Type: ' + mimeType + '\r\n\r\n';
    for (var i = 0; i < imageData.length; ++i) {
        formData += String.fromCharCode(imageData[i] & 0xff);
    }
    formData += '\r\n';
    formData += '--' + boundary + '\r\n';
    formData += 'Content-Disposition: form-data; name="message"\r\n\r\n';
    formData += message + '\r\n';
    formData += '--' + boundary + '--\r\n';

    var xhr = new XMLHttpRequest();
    xhr.open('POST', 'https://graph.facebook.com/me/photos?access_token=' + authToken, true);
    xhr.setRequestHeader("Content-Type", "multipart/form-data; boundary=" + boundary);

    // Solving problem with sendAsBinary for chrome
    try {
        if (typeof XMLHttpRequest.prototype.sendAsBinary == 'undefined') {
            XMLHttpRequest.prototype.sendAsBinary = function(text) {
                var data = new ArrayBuffer(text.length);
                var ui8a = new Uint8Array(data, 0);
                for (var i = 0; i < text.length; i++) ui8a[i] = (text.charCodeAt(i) & 0xff);
                this.send(ui8a);
            }
        }
    } catch (e) {}
    xhr.sendAsBinary(formData);
};

Wydaje mi się, że mam podobny problem, ale powyższe rozwiązania nie zadziałały.

Używałem rozwiązania zaproponowanego przez Arrabi (wystarczy użyć tylko właściwości url) do publikowania obrazów bez żadnego problemu. Moje obrazy mają około 2-3 MB każdy.

Kiedy migrowałem moją aplikację na inny serwer (zmieniając bezwzględny adres url moich obrazów w poście) metoda dawała mi błędy 324 dla obrazów powyżej rozmiaru około 100k.

Myślałem, że to z powodu jakiegoś Apache ustawienia na mojej stronie, ale kiedy zmieniłem apache dla lighttpd problem nadal istniał.

Połączenia z Facebook rzeczywiście pojawiają się w moim (apache) logu:

69.171.234.7 - - [08/Jun/2012:11:35:54 +0200] "Pobierz / images/cards / 1337701633_518192458.png HTTP/1.1" 200 2676608 "-" "facebookplatform / 1.0 (+http://developers.facebook.com)"

69.171.228.246 - - [08/Jun/2012:11:42:59 +0200] "Pobierz / images / test5.jpg HTTP/1.1" 200 457402 " - ""facebookplatform / 1.0 (+http://developers.facebook.com)"

69.171.228.246 - - [08/Jun/2012:11:43:17 +0200] "Pobierz / images / test4.jpg HTTP/1.1" 200 312069 " - ""facebookplatform / 1.0 (+http://developers.facebook.com)"

69.171.228.249 - - [08/Jun/2012:11:43:49 +0200] "Pobierz / images / test2.png HTTP/1.1" 200 99538 " - ""facebookplatform / 1.0 (+http://developers.facebook.com)"

69.171.228.244 - - [08/Jun/2012:11:42:31 +0200] "Pobierz / images / test6.png HTTP/1.1" 200 727722 " - "" facebookplatform / 1.0 (+http://developers.facebook.com) "

Tylko test2.png udało się.

Używam poniższego, aby udostępnić zdjęcie (niektóre BitmapData z frameworka Phaser). Wygląda na to, że działa...

// Turn data URI to a blob ready for upload.
dataURItoBlob(dataURI:string): Blob {
    var byteString = atob(dataURI.split(',')[1]);
    var ab = new ArrayBuffer(byteString.length);
    var ia = new Uint8Array(ab);
    for (var i = 0; i < byteString.length; i++) {
        ia[i] = byteString.charCodeAt(i);
    }
    return new Blob([ab], { type: 'image/jpeg' });
}

// Share the given bitmapData as a photo on Facebook
sharePhoto(accessToken: string, photo: BitmapData, message: string): void {
    // Create form data, set up access_token, source and message
    var fd = new FormData();
    fd.append("access_token", accessToken);
    fd.append("source", this.dataURItoBlob(photo.canvas.toDataURL("image/jpeg")));
    fd.append("message", message);

    var request = new XMLHttpRequest();
    var thisPtr = this;
    request.onreadystatechange = function () {
        if (request.readyState == XMLHttpRequest.DONE) {
            var json = JSON.parse(request.responseText);
            if (json.hasOwnProperty("error")) {
                var error = json["error"];
                if (error.hasOwnProperty("type")) {
                    var errorType = error["type"];
                    if (errorType === "OAuthException") {
                        console.log("Need to request more permissions!");
                    }
                }
            }
        } else if (request.readyState == XMLHttpRequest.HEADERS_RECEIVED) {

        } else if (request.readyState == XMLHttpRequest.LOADING) {

        } else if (request.readyState == XMLHttpRequest.OPENED) {

        } else if (request.readyState == XMLHttpRequest.UNSENT) {

        }
    }
    request.open("POST", "https://graph.facebook.com/me/photos", true);
    request.send(fd);
}

W przypadku, gdyby ktoś nadal szukał sposobu na wgrywanie bezpośrednio z canvas na zdjęcia Facebook, to działa dla mnie:

function postImageToFacebook(token, imageData, message, successCallback, errorCallback) {
  var fd = new FormData();
  fd.append("access_token", token);
  fd.append("source", imageData);
  fd.append("caption", message);

  $.ajax({
      url: "https://graph.facebook.com/me/photos?access_token=" + token,
      type: "POST",
      data: fd,
      processData: false,
      contentType: false,
      cache: false,
      success: function (data) {
        successCallback(data);
      },
      error: function (shr, status, data) {
        errorCallback(data);
      },
      complete: function (data) {
        console.log('Completed');
      }
  });
}

function dataURItoBlob(dataURI) {
  var byteString = atob(dataURI.split(',')[1]);
  var ab = new ArrayBuffer(byteString.length);
  var ia = new Uint8Array(ab);
  for (var i = 0; i < byteString.length; i++) {
      ia[i] = byteString.charCodeAt(i);
  }
  return new Blob([ab], {type: 'image/jpeg'});
}

To use it

// *IMPORTANT*
var FBLoginScope = 'publish_actions'; // or sth like 'user_photos,publish_actions' if you also use other scopes.

var caption = "Hello Facebook!";
var successCallback = ...;
var errorCallback = ...;

var data = $('#your_canvas_id')[0].toDataURL("image/jpeg");
try {
  imageData = dataURItoBlob(data);
} catch (e) {
  console.log(e);
}

FB.getLoginStatus(function (response) {
  if (response.status === "connected") {
    postImageToFacebook(response.authResponse.accessToken, imageData, caption, successCallback, errorCallback);
  } else if (response.status === "not_authorized") {
    FB.login(function (response) {
        postImageToFacebook(response.authResponse.accessToken, imageData, caption, successCallback, errorCallback);
    }, {scope: FBLoginScope});
  } else {
    FB.login(function (response) {
        postImageToFacebook(response.authResponse.accessToken, imageData, caption, successCallback, errorCallback);
    }, {scope: FBLoginScope});
  }
});

Modified from: http://gorigins.com/posting-a-canvas-image-to-facebook-and-twitter/