Html chrome扩展下载本地存储数据

我目前开发了一个扩展，用户可以通过选项页进行自定义，我使用localStorage来保存数据。现在我想做这样一个功能，用户可以导出他们的自定义数据，这样他就可以与其他人共享，用户也可以导入其他人导出的数据

也就是说，我需要导入和导出功能

在谷歌搜索stackoverflow扩展api后，我发现chrome扩展无法使用api读/写文件，因为它只能在应用程序中使用，所以我只能向

使用html5文件系统api，我实际上可以打开一个文件并读取它。 但是说到写文件，html5只能在沙箱中写文件，这绝对不是我想要的

然后我发现了铬。在下载方法中，它需要一个参数，即要下载的url

所以我的问题是：

是否可以通过此方法下载localstoage数据，或者

是否有其他方法保存用户的自定义数据

---

Xan讨论中引用的解决方案有点过时。不久前，我在分机上也做了同样的事情。它在GWT框架中，所以现在我快速编写了JS版本（见下面的代码）

流程如下：

• 生成文件内容作为用户操作的回调（\u getFileContents）
• 使用Blob构造函数创建文件（_createDownloadData）
• 使用window.URL.createObjectURL（_createDownloadData）获取文件的URL引用
• 将所需属性设置为将用于下载文件的锚点（prepareFileExport）

此方法需要用户执行两个步骤：

点击一些“准备数据”按钮

生成文件后，单击链接下载实际文件

但您可以在扩展名中轻松实现下载文件功能

JavaScript:

var FileDownload = {

  //Existing file URL.
  exportFileObjectUrl: null,

  // add click listener to the "prepare" button
  initialize: function(){
    FileDownload.prepareButton.addEventListener('click', FileDownload.prepareFileExport);
  },

  // prepare the file and "add" it the download button.
  prepareFileExport: function(e){
    var content = FileDownload._getFileContents();
    var contentType = 'application/json';
    FileDownload.exportFileObjectUrl = FileDownload._createDownloadData(content, contentType);

    var fileName = "some_file.json";
    FileDownload.downloadButton.href = FileDownload.exportFileObjectUrl;
    FileDownload.downloadButton.setAttribute("download", fileName);
    FileDownload.downloadButton.setAttribute("data-downloadurl", contentType + ":" + fileName + ":" + FileDownload.exportFileObjectUrl);
    FileDownload.downloadButton.removeAttribute("hidden");
  },

  // File content generator
  _getFileContents: function(){
    //generate some content as a string.
    var mock = {
      'a': 'test data'
    };
    return JSON.stringify(mock);
  },

  //Result with URL to the file.
  _createDownloadData: function(data, contentType){
    if(FileDownload.exportFileObjectUrl !== null){
      FileDownload._revokeDownloadData();
    }
    var blob = new window.Blob([data], {type: contentType});
    return window.URL.createObjectURL(blob);
  },

  /// Cleanup.
  _revokeDownloadData: function(){
    window.URL.revokeObjectURL(FileDownload.exportFileObjectUrl);
  },

  // a reference to the "prepare" button
  get prepareButton(){
    /// prepare button.
    return document.querySelector('[prepare]');
  },

  // a reference to the "download" button.
  get downloadButton(){
    /// Download button.
    return document.querySelector('[download]');
  }

};

FileDownload.initialize();

<button prepare>Prepare data</button>
<a href="about:blank" download hidden>Download data</a>

HTML:

var FileDownload = {

  //Existing file URL.
  exportFileObjectUrl: null,

  // add click listener to the "prepare" button
  initialize: function(){
    FileDownload.prepareButton.addEventListener('click', FileDownload.prepareFileExport);
  },

  // prepare the file and "add" it the download button.
  prepareFileExport: function(e){
    var content = FileDownload._getFileContents();
    var contentType = 'application/json';
    FileDownload.exportFileObjectUrl = FileDownload._createDownloadData(content, contentType);

    var fileName = "some_file.json";
    FileDownload.downloadButton.href = FileDownload.exportFileObjectUrl;
    FileDownload.downloadButton.setAttribute("download", fileName);
    FileDownload.downloadButton.setAttribute("data-downloadurl", contentType + ":" + fileName + ":" + FileDownload.exportFileObjectUrl);
    FileDownload.downloadButton.removeAttribute("hidden");
  },

  // File content generator
  _getFileContents: function(){
    //generate some content as a string.
    var mock = {
      'a': 'test data'
    };
    return JSON.stringify(mock);
  },

  //Result with URL to the file.
  _createDownloadData: function(data, contentType){
    if(FileDownload.exportFileObjectUrl !== null){
      FileDownload._revokeDownloadData();
    }
    var blob = new window.Blob([data], {type: contentType});
    return window.URL.createObjectURL(blob);
  },

  /// Cleanup.
  _revokeDownloadData: function(){
    window.URL.revokeObjectURL(FileDownload.exportFileObjectUrl);
  },

  // a reference to the "prepare" button
  get prepareButton(){
    /// prepare button.
    return document.querySelector('[prepare]');
  },

  // a reference to the "download" button.
  get downloadButton(){
    /// Download button.
    return document.querySelector('[download]');
  }

};

FileDownload.initialize();

<button prepare>Prepare data</button>
<a href="about:blank" download hidden>Download data</a>

准备数据

请注意：关于这个主题有一个老问题，它已经严重过时，但如果这个问题在中得到回答，也需要更新。嗨，PawełPsztyć，首先感谢你的回答。我目前使用chrome extension download api向用户写入文件，我最初错过的是如何将Blob对象转换为url，可以使用window.URL.createObjectURL（blob）解决此问题