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,我是这样做的:
/**
* 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);
};
我一直希望为自己做一个chrome扩展来批量下载图片。但每次我都感到沮丧,因为唯一似乎适用的选项是NPAPI,chrome和firefox似乎都不想再支持它了。 我建议那些仍然想实现“将文件保存在磁盘上”功能的人看看这个Stackoverflow post,这篇文章下面的评论对我帮助很大。 现在,自chrome 31+以来,chrome.downloads API变得稳定。我们可以使用它编程下载文件。如果用户没有在chrome设置中设置ask me before every download advance选项,我们可以保存文件,而不提示用户确认! 以下是我使用的(在扩展的背景页面):
// remember to add "permissions": ["downloads"] to manifest.json
// this snippet is inside a onMessage() listener function
var imgurl = "https://www.google.com.hk/images/srpr/logo11w.png";
chrome.downloads.download({url:imgurl},function(downloadId){
console.log("download begin, the downId is:" + downloadId);
});
7条答案
按热度按时间50few1ms1#
您可以使用HTML5 FileSystem features通过Download API写入磁盘。这是将文件下载到磁盘的唯一方法,并且它是有限的。
你可以看看NPAPI插件。另一种方法是简单地通过XHR POST向外部网站发送一个请求,然后另一个GET请求来取回文件,这将显示为保存文件对话框。
例如,对于我的浏览器扩展My Hangouts,我创建了一个实用程序,可以将HTML5 Canvas中的照片直接下载到磁盘。您可以在这里查看代码capture_gallery_downloader.js,该代码是:
如果你想在HTML5中实现将URI转换为Blob,我是这样做的:
然后在用户点击下载按钮之后,它将使用“下载”HTML5文件API将blob URI下载到文件中。
s2j5cfk02#
我一直希望为自己做一个chrome扩展来批量下载图片。但每次我都感到沮丧,因为唯一似乎适用的选项是NPAPI,chrome和firefox似乎都不想再支持它了。
我建议那些仍然想实现“将文件保存在磁盘上”功能的人看看这个Stackoverflow post,这篇文章下面的评论对我帮助很大。
现在,自chrome 31+以来,
chrome.downloads
API变得稳定。我们可以使用它编程下载文件。如果用户没有在chrome设置中设置ask me before every download
advance选项,我们可以保存文件,而不提示用户确认!以下是我使用的(在扩展的背景页面):
虽然很遗憾chrome在下载完成后仍然不提供
Event
。chrome.downloads.download
的回调函数在下载begin
成功时被调用(而不是在完成时)关于
chrome.downloads
的官方文档是here。这不是我最初的想法关于解决方案,但我张贴在这里,希望它可能是一些使用的人。
agyaoht73#
据我所知,没有办法悄悄地将文件保存到用户的驱动器上,这似乎是您希望做的。我认为您可以要求文件一次保存一个(每次提示用户)使用如下:
如果你只想提示用户一次,你可以默默地抓取所有的图片,压缩成一个捆绑包,然后让用户下载。这可能意味着对所有的文件执行XmlHttpRequest,用Javascript压缩它们,上传它们到暂存区域,然后询问用户是否愿意下载压缩文件。我知道,这听起来很荒谬。
浏览器中有本地存储选项,但据我所知,它们仅供开发人员在沙箱中使用。(例如Gmail离线缓存。)
2cmtqfgy4#
我做了一个扩展,做了类似这样的事情,如果这里有人仍然感兴趣:GitHub
它使用一个
XMLHTTPRequest
来抓取对象,在本例中假定是一个图像,然后对它创建一个ObjectURL
,一个指向该ObjectUrl的链接,并单击虚构的链接。r1zk6ea15#
考虑使用HTML5 FileSystem features,使使用Javascript写入文件成为可能。
0md85ypi6#
看起来从浏览器阅读和写入文件已经成为可能。一些较新的基于Chromium的浏览器可以使用“本地文件系统API”。这篇2020年的博客文章展示了使用JavaScript读取和写入本地文件系统的代码示例。
https://blog.merzlabs.com/posts/native-file-system/
此链接显示哪些浏览器支持本机文件系统API。
https://caniuse.com/native-filesystem-api
bt1cpqcv7#
由于Javascript可以从任何地方搭便车到你的电脑上,所以给予它有能力写入你的磁盘是很危险的。
这是不允许的。你认为Chrome扩展程序需要用户交互吗?否则它可能属于同一类别。