将.jpg文件存储在本地存储中

4 回答

• 10

  我也使用支持 offline case 的HTML5缓存清单，专为您的问题而设计 . 不要在base64中使用本地存储，因为：

  • Base64编码增加文件大小to 137% (!)

  • 该算法会降低您的应用程序速度，因为不仅Internet速度限制了您的应用程序，而且还需要javascript .

  • 本地存储不支持evertime，也有限制！

  对于缓存清单，您可以查看w3.org - Cache Manifests也在html5 Rocks上有一个初学者指南 .

  如果你不想使用HTML5 chache manifest，你应该尝试尽可能多地提高速度，在stackoverflow上的很多帖子中描述，我喜欢在about increasing Math Object的帖子中找到the presentation的链接

  回复于 2024-04-26T16:25:00+08:00
• 0

  您可以在支持的地方使用 canvas 元素和 toDataURL 方法 . 像这样的东西：

  var ctx = canvas.getContext("2d");
  
  var img = new Image();
  
  img.onload = function() {
     canvas.width = this.width;
     cavans.height = this.height;
  
     ctx.drawImage(this, 0, 0);
  
     var base64jpeg = canvas.toDataURL("image/jpeg");
  }
  
  img.src = "/images/myjpeg.jpg";
  

  但是如果你想这样做“提高网站速度”，可以使用HTML5清单进行缓存：它的设计正是为了这个目的（当然还有离线应用程序） .

  回复于 2024-04-26T16:25:00+08:00
• 2

  通过创建缓存清单来使用HTML5缓存可能更好/更容易 .

  回复于 2024-04-26T16:25:00+08:00
• 0

  顺便说一句，谷歌和Bing做了一些测试，试图看看哪种缓存方法更快，这里是results. SPOILER ALERT !!!! localStorage更好 .

  回复于 2024-04-26T16:25:00+08:00