Chrome 扩展程序:如何在磁盘上保存文件 [英] Chrome extension: How to save a file on disk

问题描述

我目前正在为 google chrome 创建一个扩展程序，它可以将所有图像或图像链接保存在硬盘上.

I'm currently creating an extension for google chrome which can save all images or links to images on the harddrive.

问题是我不知道如何使用 JS 或 Google Chrome 扩展 API 将文件保存在磁盘上.

The problem is I don't know how to save file on disk with JS or with Google Chrome Extension API.

你有什么想法吗?

推荐答案

您可以使用 使用 写入磁盘的 HTML5 文件系统功能下载 API.这是将文件下载到磁盘的唯一方法，而且是有限制的.

You can use HTML5 FileSystem features to write to disk using the Download API. That is the only way to download files to disk and it is limited.

你可以看看 NPAPI 插件.另一种方法是通过 XHR POST 向外部网站发送请求，然后通过另一个 GET 请求检索文件，该请求将显示为保存文件对话框.

You could take a look at NPAPI plugin. Another way to do what you need is simply send a request to an external website via XHR POST and then another GET request to retrieve the file back which will appear as a save file dialog.

例如，对于我的浏览器扩展我的环聊，我创建了一个实用程序来下载从 HTML5 Canvas 直接到磁盘的照片.你可以看看这里的代码 capture_gallery_downloader.js 执行此操作的代码是:

For example, for my browser extension My Hangouts I created a utility to download a photo from HTML5 Canvas directly to disk. You can take a look at the code here capture_gallery_downloader.js the code that does that is:

var url = window.webkitURL || window.URL || window.mozURL || window.msURL;
var a = document.createElement('a');
a.download = 'MyHangouts-MomentCapture.jpg';
a.href = url.createObjectURL(dataURIToBlob(data.active, 'jpg'));
a.textContent = 'Click here to download!';
a.dataset.downloadurl = ['jpg', a.download, a.href].join(':');

如果您希望在 HTML5 中实现将 URI 转换为 Blob，我是这样做的:

If you would like the implementation of converting a URI to a Blob in HTML5 here is how I did it:

/**
 * Converts the Data Image URI to a Blob.
 *
 * @param {string} dataURI base64 data image URI.
 * @param {string} mimetype the image mimetype.
 */
var dataURIToBlob = function(dataURI, mimetype) {
  var BASE64_MARKER = ';base64,';
  var base64Index = dataURI.indexOf(BASE64_MARKER) + BASE64_MARKER.length;
  var base64 = dataURI.substring(base64Index);
  var raw = window.atob(base64);
  var rawLength = raw.length;
  var uInt8Array = new Uint8Array(rawLength);

  for (var i = 0; i < rawLength; ++i) {
    uInt8Array[i] = raw.charCodeAt(i);
  }

  var bb = new this.BlobBuilder();
  bb.append(uInt8Array.buffer);
  return bb.getBlob(mimetype);
};

然后在用户点击下载按钮后，它将使用下载"HTML5 File API 将 blob URI 下载到一个文件中.

Then after the user clicks on the download button, it will use the "download" HTML5 File API to download the blob URI into a file.

这篇关于Chrome 扩展程序:如何在磁盘上保存文件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！