在 JavaScript 中生成带有字节数组的 <IMG> 标记？

【问题标题】：Generate an <IMG> tag in JavaScript with an array of bytes?在 JavaScript 中生成带有字节数组的 <IMG> 标记？
【发布时间】：2012-07-25 17:44:12
【问题描述】：

我有一个包含两列的 SQL Server 表 - 一个整数 ID 和一个 varbinary(max) ImageData，它是一个 JPEG 图像。在 Javascript 中，我有一个 Ajax 调用来获取特定 ID 的 ImageData 并将其作为字节数组返回。如何生成将显示图像的 XHTML IMG 标记？

我的想法是在返回的数组上使用 createObjectURL，但是 (a) 这需要能够在 IE 8 上运行，这似乎不支持该方法，并且 (b) Firefox 似乎期待一个实际的Blob 类型而不是字节数组（并且 Blob() 构造函数似乎不存在）。

我确实有一个替代方案 - 将数据作为 Base64 字符串返回，然后使用标签，但这在 IE8 中不起作用，并且在其他浏览器上可能存在大小限制（某些图像为 600K，这意味着标记可能有超过 100 万个字符）。

【问题讨论】：

标签： javascript image

【解决方案1】：

您正在过度设计一个已经存在更简单解决方案的问题。

使用 AJAX 插入以下 HTML 并让浏览器通过 HTTP 自行获取图像。通过 AJAX 发送图像数据需要毫无意义的 base64 编码/解码，最终会占用更多带宽并破坏浏览器缓存。

<img src="imageServer.php?imageID=3224" />

然后imageServer.php（你构建它或在某个地方抓取它）将抓取适当的图像记录，输出图像 MIME 类型，然后流式传输二进制数据。

【讨论】：

我可以在 ASP.NET 中返回一个流 - 但是我如何（在这种情况下）imageServer.php 向 IMG 标签表明它正在发送一个图像/jpeg 类型？
输入。 NET，这样：stackoverflow.com/questions/6252086/…
按 F-12 打开调试器。打开 NET/XHR 选项卡，看看是否有某种错误。