使用 Javascript graph API v2.5 将照片作为 multipart/form-data 发布到 Facebook

Question

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

1：附上照片multipart/form-data。对象的名称并不重要，但历史上人们使用 source 作为 photo.How 的参数名称，这取决于您碰巧用来执行 post.[=18 的 SDK =]

2：通过使用 url 参数发布来使用互联网上已有的照片：

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

我需要使用 first 方法（多部分），因为我已经从 canvas.

获得了 base64 图像数据

这似乎令人困惑，因为我发现文档提供的信息不多。我知道图像的 urlData 将与其他参数一起以某种格式编码在多部分数据中。我找不到任何关于如何使用 Javascript SDK & graph api v2.5 执行此操作的工作示例 code/proper 解释；即使在对 Whosebug 进行了详尽的搜索之后。我在 Whosebug 上看到了关于此的各种部分 answered/unanswered 问题......但我仍然无法让它工作。

请帮忙。谢谢！

类似问题
Facebook Javascript Form Data Photo Upload: requires upload file error
Javascript: Upload image from Canvas to FB via Graph API
Upload Base64 Image Facebook Graph API - 不清楚 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) 图像文件丢失或无效“

Answer 1

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

首先，使用以下函数将 Canvas 图像转换为 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/

使用 Javascript graph API v2.5 将照片作为 multipart/form-data 发布到 Facebook

Publishing photo as multipart/form-data to Facebook using Javascript graph API v2.5

javascript

facebook-graph-api

multipartform-data

todataurl