我在 Canvas 中合成图像,我通过使用 canvas.toDataURL('png')
获取 base64 图像数据并 trim 附加信息。
var dataUrl = canvas.toDataURL('png');
var escapedBase64Data = dataUrl.replace("data:image/png;base64,","");
之后我尝试使用以下方式发布到 facebook:
FB.api('/me/photos', 'post', { source:data});
Photos ( https://developers.facebook.com/docs/reference/api/user/ ) 有一个 source 属性。您将在此处放置照片的数据内容 (multipart/form-data)。
我通过指定 header 将我的 base64 编码数据转换为 multipart/form-data。
结果是这样的:
--0.2242348059080541
Content-Disposition: file; name="file"; filename="image.png"
Content-Type: image/png
Content-Transfer-Encoding: base64
iVBORw0KGgoAAAANSUhEUgAAAfQAAAH0CAYAAADL1t+KAAAbBElEQVR4Xu3dP4jre0LG4V2xsFVYEKy
...
QAAAABJRU5ErkJggg==
--0.2242348059080541--
完成 FB api 调用后,我收到以下错误:
Object {message: "(#324) Requires upload file", type: "OAuthException", code: 324}
有什么建议吗?
谢谢
最佳答案
这里是一个工作代码示例:
var boundary = '----ThisIsTheBoundary1234567890';
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 += f.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.onload = xhr.onerror = function() {
// error managment
};
xhr.setRequestHeader("Content-Type", "multipart/form-data; boundary=" + boundary);
//Send the request
xhr.sendAsBinary(formData);
关于Javascript:通过 Graph API 将图像从 Canvas 上传到 FB,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15739555/