HTML：将上传的照片存储在 LocalStorage [重复]答案

【问题标题】：HTML: Storing Uploaded Photo in LocalStorage [duplicate]HTML：将上传的照片存储在 LocalStorage [重复]
【发布时间】：2018-03-08 05:16:32
【问题描述】：

我正在构建一个 Web 应用程序，它允许用户使用内置相机拍照并将照片上传到应用程序，该应用程序会将照片存储在内存中。目前，我正在使用下面的代码行来捕获和上传照片。

<input type="file" accept="image/*">

如何将图像存储在localStorage 中？有没有办法在 HTML 中的 Javascript 中实现此功能？

【问题讨论】：

这可能不是您问题的完整答案，但我认为this 可能是一个有用的资源。

标签： javascript html

【解决方案1】：

试试这样的：

const input = document.getElementsByTagName('input')[0]; // or id or whatever selector you want to use

input.onchange = (function(e) {
  const file = e.path[0].files[0];
  const reader = new FileReader();

  reader.readAsDataURL(file);

  reader.onload = function() {
    const id = 'blobid' + (new Date()).getTime();
    const blobCache = tinymce.activeEditor.editorUpload.blobCache;
    const base64 = reader.result.split(',')[1];
    localStorage.setItem('imageString', base64);
  };
});

【讨论】：