问题描述
我已经读过某个地方,Facebook已经交叉启用个人资料图片。我不确定相册和其他的东西,但事实上,Facebook是包括标题 Access-Control-Allow-Origin:*
在我的每一个网址
<$ c $ c> https://graph.facebook.com/PROFILE_ID/picture?width=25&height=25
以及Akamai网址:
https://fbcdn-sphotos-ha.akamaihd.net/hphotos-ak- ash3 / ...
(后者由 https://返回graph.facebook.com/PROFILE_ID/photos
)
我的应用程式基本上是做as:
var img = new Image;
img.src =https://fbcdn-sphotos-h-a.akamaihd.net/hphotos-ak-ash3 / ...;
img.crossOrigin =匿名;
img.onload = function(){
ctx.drawImage(img,x,y);
}
//上面的代码将重复几次
//与操作ctx的代码混合
//最后generetes数据
var generatedImage = canvas.toDataURL();
//如果回到Facebook,就会发帖
(在所有主要浏览器上测试),但是有很多用户报告间歇性bug,当上传画布内容回到Facebook。
不幸的是,我还不能得到一个技术精明的用户报告一个具有正确的错误描述。现在我不能重现的问题(或甚至知道什么问题)。
到目前为止,我所知道的是,通过编写一个服务器端代理来服务Facebook图片,就像它们是本地的一样,这些错误显然消失了,所以,在我开始挖掘奇怪的跨浏览器问题之前,神秘的错误消息,如 OAuthException:发生未知错误。
,污染的cavas等,我首先要回到基本信息:
对于通过Graph API公开的每个图片,是否启用CORS? (
再次回答我自己的问题。
显然是,对通过Graph API公开的每个图片启用CORS。他们都被返回 Access-Control-Allow-Origin:*
。
似乎有些浏览器不能很好地与 crossorigin ='anonymous'
和CORS标题,所以,现在,代理服务仍然是安全的方式去。
I've read somewhere that Facebook have cross enabled for Profile Pictures. I'm not sure about albums and other stuff, but in fact Facebook is including the header Access-Control-Allow-Origin: *
on every one of the URLs that I have tested to far.
I've tried the standard Profile picture URL
https://graph.facebook.com/PROFILE_ID/picture?width=25&height=25
And well as Akamai urls:
https://fbcdn-sphotos-h-a.akamaihd.net/hphotos-ak-ash3/...
(The latter are returned by https://graph.facebook.com/PROFILE_ID/photos
)
My app is basically doing things such as:
var img = new Image;
img.src = "https://fbcdn-sphotos-h-a.akamaihd.net/hphotos-ak-ash3/...";
img.crossOrigin = "Anonymous";
img.onload = function() {
ctx.drawImage(img, x, y);
}
// Above code will be repeated several times
// And mixed with code that manipulates ctx
// Finally generetes data
var generatedImage = canvas.toDataURL();
// And post if back to Facebook
Everything seems to be working fine with my code (tested on all major browsers), but there are a lot of users reporting intermittent bugs when uploading the canvas content back to Facebook.Unfortunately I couldn't yet get a tech savvy user to report something with a proper error description. Now I can't reproduce the problem (or even know what the problem is).
What I know so far is that by writing a server side proxy to serve Facebook images as if they were local the bugs apparently go away, so, it left me wondering, before I start digging into bizarre cross-browser issues, mysterious error messages such as OAuthException: An unknown error has occurred.
, tainted cavas, etc, I first have to go back to the basics:
Is CORS enabled for every single picture exposed through Graph API? (A link to the official documentation or a reliable source would be nice).
Again answering my own question.
Apparently yes, CORS is enabled for every picture exposed through the Graph API. They are all being returned with Access-Control-Allow-Origin: *
.
It seems like some browsers do not play well with crossorigin='anonymous'
and CORS headers, so, for now, a proxy service is still the safe way to go.
这篇关于CORS:有Facebook启用CORS的所有图片?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!