我已经读过Facebook已经为Profile Pictures交叉启用的地方.我不确定专辑和其他内容,但实际上Facebook在我测试过的每个网址上都包含了标题Access-Control-Allow-Origin：*.
我已经尝试过标准的个人资料图片网址
- https://graph.facebook.com/PROFILE_ID/picture?width=25&height=25
以及Akamai的网址：
- https://fbcdn-sphotos-h-a.akamaihd.net/hphotos-ak-ash3/...
(后者由https://graph.facebook.com/PROFILE_ID/photos返回)
我的应用程序基本上是这样做的：
- 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
我的代码似乎一切正常(在所有主流浏览器上都经过测试),但是有很多用户在将画布内容上传回Facebook时报告间歇性错误.
不幸的是,我还不能让精通技术的用户报告具有正确错误描述的内容.现在我无法重现问题(甚至不知道问题是什么).
到目前为止,我所知道的是,通过编写服务器端代理来为Facebook图像提供服务,好像它们是本地的,这些错误显然已经消失了,所以,在我开始挖掘奇怪的跨浏览器问题之前,它让我感到疑惑,神秘的错误信息如此作为OAuthException：发生了未知错误.,受污染的卡瓦斯等,我首先要回到基础：
解决方法
再次回答我自己的问题.
显然是的,通过Graph API公开的每张图片都启用了CORS.他们都使用Access-Control-Allow-Origin返回：*.
似乎有些浏览器不能很好地使用crossorigin =’anonymous’和CORS标头,因此,目前,代理服务仍然是安全的方式.
