Facebook Graph API - 使用JavaScript上传照片 [英] Facebook Graph API - upload photo using JavaScript

问题描述

可以使用javascript上传一个使用Facebook Graph API的文件，我觉得我很亲密。我使用以下JavaScript

Is it possible to upload a file using the Facebook Graph API using javascript, I feel like I'm close. I'm using the following JavaScript

var params = {};
params['message'] = 'PicRolled';
params['source'] = '@'+path;
params['access_token'] = access_token;
params['upload file'] = true;

function saveImage() {
    FB.api('/me/photos', 'post', params, function(response) {
        if (!response || response.error) {
            alert(response);
        } else {
            alert('Published to stream - you might want to delete it now!');
        }
    }); 
}

运行这个我收到以下错误...

Upon running this I receive the following error...

"OAuthException" - "(#324) Requires upload file"

当我尝试研究这种方法时，我可以找到关于是一个php方法来解决这个问题。

When I try and research this method all I can find out about is a php method that apears to solve this

$facebook->setFileUploadSupport(true);

但是，我使用的是JavaScript，看起来这个方法可能与Facebook图形权限有关，但是我已经设置了权限user_photos和publish_stream，我相信这是我唯一需要执行此操作的人。

However, I am using JavaScript, it looks like this method might be to do with Facebook Graph permissions, but I already have set the permissions user_photos and publish_stream, which I believed are the only ones I should need to perform this operation.

我已经看到了几个未回答的问题这在stackoverflow，希望我可以解释自己够了。谢谢你们。

I have seen a couple of unanswered questions regarding this on stackoverflow, hopefully I can explained myself enough. Thanks guys.

推荐答案

编辑：这个答案是（现在）在很大程度上是无关紧要的。如果您的图像在网络上，请根据 url param照片/rel =noreferrer> API （并在其他答案中查看示例）。如果您想将图像内容直接发布到Facebook，可能需要阅读此答案以获得理解。另请参阅HTML5的 Canvas.toDataUrl（）。

this answer is (now) largely irrelevant. If your image is on the web, just specify the url param as per the API (and see examples in other answers). If you would like to POST the image content to facebook directly, you may want to read this answer to gain understanding. Also see HTML5's Canvas.toDataUrl().

API 说：要发布照片，请使用照片文件发出POST请求附件作为multipart / form-data 。

The API says: "To publish a photo, issue a POST request with the photo file attachment as multipart/form-data."

FB预计要上传的图像的字节位于HTTP请求的正文中，但他们不在那里或者以另一种方式来看待 - FB.api（）调用中的哪一个是您提供图像本身的实际内容？

FB is expecting that the bytes of the image to be uploaded are in the body of the HTTP request, but they're not there. Or to look at it another way - where in the FB.api() call are you supplying the actual contents of the image itself?

FB。 api（） API文档记录不良，不提供包含正文的HTTP POST示例。可以推测，没有这样的例子，它不支持这一点。

The FB.api() API is poorly documented, and doesn't supply an example of an HTTP POST which includes a body. One might infer from the absence of such an example that it doesn't support this.

这可能是 - FB.api（）使用的东西叫$ code> XmlHttpRequest 在 支持的封面下，包括一个正文...查找您最喜欢的JavaScript参考。

That's probably OK - FB.api() is using something called XmlHttpRequest under the covers which does support including a body ... look it up in your favourite JavaScript reference.

但是，您仍然需要解决两个子问题：

However, you'll still have 2 sub-problems to solve:

1. 如何准备图像字节（和其余部分请求）多部分/表单数据;和


2. 获取图像本身的字节

（顺便说一下，消息体可能是PHP setFileUploadSupport（true）方法的一个方法 - 告诉 facebook 对象将消息体编码为 multipart / form-data 发送前）

(incidentally, the need to encode the message body is probably what the PHP setFileUploadSupport(true) method is for - tell the facebook object to encode the message body as multipart/form-data before sending)

问题'2'可能会咬你 - 没有办法（上次我看）从浏览器提供的图像对象提取图像的字节。

Unfortunately, sub-problem '2' may bite you - there is no way (last time I looked) to extract the bytes of an image from the browser-supplied Image object.

如果要通过URL访问要上传的图像，则可以使用XmlHttpRequest获取字节。不太糟糕。

If the image to be uploaded is accessible via a URL, you could fetch the bytes with XmlHttpRequest. Not too bad.

如果图像来自用户的桌面，您可能的追索权是向用户提供：

If the image is coming from the user's desktop, your probable recourse is to offer the user a:

 <form enctype="multipart/form-data">
     <input type="filename" name="myfile.jpg" />
     <input type="hidden" name="source" value="@myfile.jpg"/>
     <input type="hidden" name="message" value="My Message"/>
     <input type="hidden" name="access_token" value="..."/> 
 </form> 

（注意 source 引用给定的名称到文件上传小部件）

(notice that source references the name given to the file-upload widget)

...并希望FB预期以这种方式接收数据（首先尝试使用静态HTML表单，然后再编码动态地在JS）。人们可能会推断，实际上它会，因为他们不提供另一种方法。

... and hope that FB anticipated receiving the data in this manner (try it with a static HTML form first, before coding it up dynamically in JS). One might infer that in fact it would, since they don't offer another means of doing it.

这篇关于Facebook Graph API - 使用JavaScript上传照片的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！