嵌入外部图像以在HTML画布中使用？

我正在使用JavaScript将图像加载到Firefox中的Canvas元素中。这适用于本地图像，但会为外部图像引发安全性异常。有没有办法避免这种安全异常，一个不涉及我的服务器必须作为代理来本地加载图像（因为这会给我的服务器带来压力）？嵌入外部图像以在HTML画布中使用？

PS：目前的代码与此类似：

var img = new Image(); 
var contextSource = canvasSource.getContext('2d'); 
contextSource.drawImage(img, 0, 0); 
// get image data to do stuff with pixels 
var imageDataSource = contextSource.getImageData(0, 0, width - 1, height - 1);

来源

2010-04-14 Philipp Lenssen

我不认为这是可能的，因为这会打开浏览器跨域攻击。

来源

2010-04-14 09:26:19

我在我的博客文章中显示它可能是 – 2011-05-01 11:19:25

哦哦。我以为你做了回答。在今年应该看起来更好 – 2011-05-01 11:59:23

实际上，通过利用XHR等级2和UrlData可能也是如此。检查出my blog post。

来源

2011-03-13 06:21:49

事实上，你表现出真的有可能从其他领域获得图像。 – 2011-05-02 12:30:42

斯坦尼斯拉夫的方法虽然简洁，但依赖于跨源资源共享。如果您可以使用CORS访问控制允许来源来允许您的域名，则您拥有该域名，并且它可能不是“外部”服务器。 – 2011-09-07 06:06:53

可以是具有不同域/子域的相同服务器。老实说，我正在寻找一种方式来从CDN为html5游戏/应用带来图片。 – 2011-09-07 12:18:52

这适用于25.6k以下的图像。使用YQL的数据：uri转换器来获取图像并将您的base-64编码块返回。然后在客户端创建一个图像，并将其源设置为您从YQL收到的数据。例如这里：

http://kentbrewster.com/avatar-portraits

这里是向右YQL data table的链接。

[编辑修复;它是25.6k，而不是256]

来源

2011-09-06 03:51:58

您确定不小于25K，不是256K？ – jmoreno 2011-12-31 00:36:37

哎呀，对不起！固定！ – 2012-01-05 19:23:17

我其实希望我错了...... – jmoreno 2012-01-05 21:02:14

嵌入外部图像以在HTML画布中使用？

回答

相关问题