html5 – CORS:Facebook是否为其所有图片启用了CORS?

前端之家收集整理的这篇文章主要介绍了html5 – CORS:Facebook是否为其所有图片启用了CORS?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我已经读过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? (官方文档或可靠来源的链接会很好).

解决方法

再次回答我自己的问题.

显然是的,通过Graph API公开的每张图片都启用了CORS.他们都使用Access-Control-Allow-Origin返回:*.

似乎有些浏览器不能很好地使用crossorigin =’anonymous’和CORS标头,因此,目前,代理服务仍然是安全的方式.

猜你在找的HTML5相关文章