Javascript从变量渲染jpeg二进制数据

【问题标题】：Javascript render jpeg binary data from variableJavascript从变量渲染jpeg二进制数据
【发布时间】：2011-01-30 17:43:30
【问题描述】：

如何渲染 Javascript 变量中包含的 JPEG/PNG 文件数据？可能吗？需要什么 javascript 库？使用的浏览器是FF/IE。

谢谢

【问题讨论】：

JPEG/PNG 图像如何包含在 javascript 变量中？是 Base64 编码的吗？
不是 Base64 编码的，是二进制格式。
我从页面中的 Flash Player 获取二进制数据格式，通过 ExternalInterface 传输。
请注意，数据架构可能会导致 IE6+ 出现一些问题。特别是如果使用 HTTPS，您将收到混合内容警告

标签： png jpeg javascript

【解决方案1】：

现代浏览器支持inline images。因此，您可以将二进制数据转换为 base64 encoded string，然后将其附加到 DOM：

var img = document.createElement('img');
img.src = 'data:image/gif;base64,R0lGODlhEAAOALMAAOazToeHh0tLS/7LZv/0jvb29t/f3//Ub//ge8WSLf/rhf/3kdbW1mxsbP//mf///yH5BAAAAAAALAAAAAAQAA4AAARe8L1Ekyky67QZ1hLnjM5UUde0ECwLJoExKcppV0aCcGCmTIHEIUEqjgaORCMxIC6e0CcguWw6aFjsVMkkIr7g77ZKPJjPZqIyd7sJAgVGoEGv2xsBxqNgYPj/gAwXEQA7';
img.width = '16';
img.height = '14';
document.body.appendChild(img);

【讨论】：