Question

我有一个解决方案，可以在存储和传输时加密图像内容：

对图像内容进行编码：base64→AES→base64
通过ajax获取编码数据
按encryptTo.js

按数据网址制作图片对象，例如：

     var image = new Image(); 
     image.src="data:image/jpeg,"+imgData.

显示图像对象

此解决方案适用于Firefox和Safari。但它无法在Internet Explorer或Google Chrome上运行。

原因是Internet Explorer或Chrome上不支持数据URL（步骤4）。无法创建图像对象。

我搜索并发现Internet Explorer很好地支持MHT文件格式。但它似乎只能插入到静态文件中。

我想过使用VBScript调用一些ActiveX应用来解决这个问题。但我对VBScript并不熟悉。

我希望得到一些帮助来弄清楚如何解决这个问题。带有ActiveX的MHT或VBScript？哪个更受欢迎？

谢谢！

Answer 1

更新：我正在为OP提供工作代码，以便通过JavaScript加载图像。该示例具有两个图像，一个具有直接嵌入HTML中的数据URI，另一个图像具有在下载包含base64图像数据的文本文件之后由Ajax回调构造的数据URI。请注意

空格正式不安全/不支持URL，因此我提前从文本文件中的base64数据中删除了空格/换行符。您可以通过添加行base64img = base64img.replace(/\s+/g, '');
当您查看此链接时，您会看到两张图片：http://www.codelib.net/2013/7-9/example.html
我的示例为Ajax等使用了一些非常小的库函数，但我并不是建议您使用它们。你自己的功能应该也能正常工作。
我的示例中的结果适用于最新版本的Opera，Chrome，Firefox，Safari和Internet Explorer（包括版本8）。
虽然您正在加密和解密数据，但原则上显示图像的工作原理相同。但是，我建议您查看解密数据，以确保您的解密算法在所有浏览器中都能正常工作，如果您仍然无法解决问题。

构建数据URI的正确方法很重要。现在所有主流浏览器的合理最新版本都支持正确形成的数据URI。听起来你正在根据你的评论使用正确的URI方案，但看到你的代码会帮助别人或我自己诊断正在发生的事情。

您是使用二进制数据形成数据URI还是将其保留为base64编码？保留base64编码可能是必要的，以避免某些浏览器尝试将二进制数据解释为Unicode字符值。您的图片src应该如下所示，但我只在您的问题中看到,而不是前面的;base64，这就是为什么我想知道您是否使用base64-编码的URL比尝试使用二进制数据更安全（即使它是由JavaScript生成的）：

data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUA
AAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO
9TXL0Y4OHwAAAABJRU5ErkJggg==

也许您只需要在逗号之前提供缺少的;base64，然后它就可以了。自版本8以来，Internet Explorer一直支持这样的数据URI，在版本9中提供了更好的支持。谷歌Chrome肯定支持这种类型的图像。

请注意，用户仍然可以毫无问题地保存图像（我只是尝试保存数据图像，甚至在Internet Explorer 10中也只是保存正常图像）。即使禁用右键单击，人们仍然可以打开文档检查器或其等效文件，并通过检查页面的资源来保存图像。您可以绘制到画布元素，但即使这样，用户仍然可以拍摄屏幕截图并获得图像的逐像素渲染。

js使用加密图像

1 个答案: