1

Facebook 的 Graph API (v2.5) User Photo Edge 表示，将照片发布到 Facebook 有两种不同的方式：

1：将照片附加为 multipart/form-data。对象的名称无关紧要，但历史上人们一直使用 source 作为照片的参数名称。它的工作原理取决于您碰巧用于发布帖子的 SDK。

2：使用已经在互联网上的照片，通过使用 url 参数发布：

FB.api(
        "/me/photos",
        "POST",
        {
            "url": "{image-url}"
        },
        function (response) {
          if (response && !response.error) {
            /* handle the result */
          }
        }
);

我需要使用第一种方法（多部分），因为我从画布中获得了 base64 图像数据。

这似乎令人困惑，因为我发现文档信息量不大。我知道图像的 urlData 将与其他参数一起在多部分数据中以某种格式编码。我找不到任何有关如何使用 Javascript SDK 和图形 API v2.5 执行此操作的示例代码/正确解释；即使在对stackoverflow进行了详尽的搜索之后。我在stackoverflow上看到了各种部分回答/未回答的问题......但我仍然无法让它工作。

请帮忙。谢谢 ！

类似的问题
Facebook Javascript 表单数据照片上传：需要上传文件错误Javascript：通过 Graph API Upload Base64 Image Facebook Graph API
从 Canvas 上传图像到 FB - 不清楚 Javascript Api 是否已经在这里

[编辑] - 我已经尝试过的代码。

var ctx = document.getElementById('canvas2');
urldata=ctx.toDataURL("image/png");
FB.api('/photos', 'POST', {
  message: 'testing Graph API',
  access_token:  accessToken,
  url: urldata,
  no_story:true
  }, function (response) {
    if (!response || response.error) {
      console.log('Error occured:' + response.error.message);
    } else {
    alert('Post ID: ' + response.id);
    } 
    } 
);

响应 -“发生错误：(#324) 图像文件丢失或无效”

4

1 回答 1

0

我无法将 JS SDK 用于此，但它适用于简单的 AJAX 请求（使用 Fetch API、axios 或其他东西）。

首先，使用以下函数将 Canvas Image 变成 Blob：

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

之后，您可以将博客与 FormData 一起使用：

formData.append('source', blob);

来源： http: //www.devils-heaven.com/facebook-javascript-sdk-photo-upload-from-canvas/

于 2018-04-06T23:22:32.527 回答