使用javascript/css将64位字符串转换为jpeg

为了避免firefox攻击性地对大型图像进行去缓存/垃圾收集，我们一直在尝试存储图像引用的方法。保留对“new Image（）”对象的引用似乎可行，但会占用大量内存

我现在正在尝试使用

$.ajax({
   url: "http://localhost/360/img/frames/compressed/frame0470.jpg",
   dataType: "text",
   success: function(r) {
      console.log(r);
   }
});

---

检索图像的base64字符串（该字符串可能存储在比图像对象更少的内存中，并且不受firefox图像垃圾收集的约束）。但是我怎样才能将其转换回jpeg格式呢？

我不知道你想要实现这一点的原因，但我想回答你的问题：

基本理念：

您需要将该数据编码到Base64：

var base64Data = Base64.encode(r);

显示Base64图像：

$('<img>') // create new image
    .attr('src', 'data:image/jpeg;base64,' + base64Data) // set image data as b64
    .appendTo('body'); // add the image tag to the body element (or any other)

$（'
但实际上它似乎有点复杂：
我也不太明白您想要实现的原因，但是您应该能够在XHR中获取二进制数据，而不是局限于jQuery提供的类型

首先，阅读这里的MDC文档以检索图像的适当二进制字符串

其次，二进制字符串可以通过
window.btoa（）
转换为base64

第三，可以通过构造数据url来显示base64图像字符串。我相信您已经知道如何执行此操作

与实际的二进制数据相比，二进制字符串占用的内存增加了4倍，因为Javascript在内部使用UCS-2时，字符串中的每个字符实际上占用了4个字节。Base64字符串占用的内存增加了4*1.3=5.2倍。Base64数据比原始数据大130%

在Javascript中处理二进制数据的一个好方法是使用Blob对象

如果要避免攻击性的图像逐出，我认为可能的方法是将图像粘贴到元素并显示它

actual附带一个内置函数
toDataURL（）
提供您想要的数据，但是如果您成功地删除了映像，那么您就不需要它了。
我猜您指的是base64。作为响应，您得到的是映像的文本表示形式。不是base64。但是，您试图做的事情听起来好像是个坏主意。处理缓存服务器端的过期问题。@binarious-可能是这样的le我在这一点上错了，因为我没有深入研究，但在最近的版本中，firefox似乎实现了一种积极的垃圾收集功能，即定期从内存中删除图像（即使它们当前正被未聚焦选项卡中的网页使用）（可能是为了提高性能）.也许“缓存”不是我应该使用的术语-我会修改这个问题以反映this@binarious好吧，这太激进了。在我们当前的页面上，我们正在预加载一些图像以按顺序显示。由于css/html中没有直接包含图像，除非我们将其存储在
图像
对象中，否则图像通常会被覆盖在它出现在屏幕上之前收集的年龄。我还没有计时，但firefox真的不会等待很长时间（看起来不到一秒钟）在假设图像可以被丢弃之前。我将尝试使用expires标题，看看它是否能改善情况。这是一篇文章中的两个答案！尝试两种方法并告诉我结果！最后，我们将需要很快使用的图像存储在图像对象中，并实现我们自己的garabage收集实用程序，以确保最小的nu已存储图像数，但您的答案看起来不错。如果我需要使用base64图像字符串，我将重新访问此链接。上面的链接已断开，正确的链接为