从Javascript变量中的数据创建HTML图像

我在Javascript变量中有图像数据（JPEG或PNG）。如何在HTML文档中显示图像？这些是非常大的图像，这样的代码不起作用，因为URI太长：

// doesn't work because the URI is too long
$('img#target').attr('src', 'data:...');

使用canvas可能是答案，但我不知道如何用图像数据加载它

如果您想知道：不，我不能直接将图像数据下载到img标签。它来自服务器，使用Javascript在浏览器中加密和解密

谢谢，

---

--艺术Z.

使用数据URL在画布上绘制：

var img = new Image;
img.onload = function(){
  myCanvasContext.drawImage(img,0,0);
};
img.src = "data:...";

请确保在

src

之前设置

onload

你说“URI太长了”，但不清楚这是什么意思。只有IE8对数据URI有32kB的限制；对于其他浏览器，它应该可以正常工作。如果您遇到错误，请描述它。

结果是

$('img#target').attr('src', 'data:...');

---

在除IE之外的所有情况下都有效。我的问题源自其他地方。

并非所有地方都完全支持数据URI和画布。通过加密服务器代理图像，并将其作为普通图像使用，怎么样？这些是大图像。例如，我是否可以拥有一个img.src=“data:…”文件，其中数据长度为1MB或以上？（不支持IE8没关系。）@ArtZ是的，应该可以。这很容易测试，对吗？@Phogz是的，你说得对。它适用于除IE之外的所有应用程序。我遇到的问题似乎是由工作流程中的早期数据被损坏引起的。谢谢你鼓励我到别处去寻找这个虫子。@ArtZ我很高兴它对你有用。作为堆栈溢出的新用户，请注意，您应该“向上投票”（三角形）任何您认为有用的答案，如果任何一个答案回答了您的问题，您应该“接受”（选中标记）。这会给你带来声誉，也会奖励那些在网站上贡献自由时间回答问题的人。@Phrogz Stack Overflow不会让我投票，因为我没有15个声誉点。