开发者

Force download in Google Chrome Extension

开发者 https://www.devze.com 2023-01-26 23:32 出处:网络
I\'m writing an Google Chrome extension that lets you download a backup file of your data. I want the user to be able to press a button and a \"Save as\" dialog box should open and they can save the f

I'm writing an Google Chrome extension that lets you download a backup file of your data. I want the user to be able to press a button and a "Save as" dialog box should open and they can save the file to their computer. Nothing appears to work and I have not found an answer on the internet. I have tried sever开发者_如何学Pythonal approaches:

  1. Using document.execCommand('SaveAs', null, 'filename.json'); This does not work because this command is IE-only and there does not appear to be a Webkit-alternative
  2. Using data URIs. This was the most promising and worked in Opera and Firefox, but the problem being that neither Chrome nor Safari appear to support the Content-disposition=attachment;-header in the URI. This should work. (Chrome doesn't even allow me to ctrl/cmd+s a page from a data URI)
  3. Using an XMLHTTPRequest. I haven't tried this, but there has to be some way in which you could relay the request around? Please note that I do not want to use an external server (in that case I could have simply sent a POST-request and applied a Content-disposition:-header)
  4. Using an available Chrome Extension API. But there does not seem to be anything for this purpose.

The reason I don't want to use any external server is that I don't want to have to pay for the hosting, and the data sent might be sensitive to the user, and I don't want infringe on anyone's privacy.

Has anyone gotten this to work?


I did it as follows in Appmator code on Github.

The basic approach is to build your Blob, however you want (Chrome/WebKit/Firefox has a responseBlob on XmlHttpRequest so you can use that), create an iframe (hidden, display:none) then assign the src of the iframe to be the Blob.

This will initiate a download and save it to the filesystem. The only problem is, you can't set the filename yet.

var savaeas = document.getElementById("saveas");
var bb = new (window.BlobBuilder || window.WebKitBlobBuilder)();

var output = Builder.output({"binary":true});
var ui8a = new Uint8Array(output.length);

for(var i = 0; i< output.length; i++) {
  ui8a[i] = output.charCodeAt(i);
}

bb.append(ui8a.buffer);

var blob = bb.getBlob("application/octet-stream");
var saveas = document.createElement("iframe");
saveas.style.display = "none";

if(!!window.createObjectURL == false) {
  saveas.src = window.webkitURL.createObjectURL(blob); 
}
else {
  saveas.src = window.createObjectURL(blob); 
}

document.body.appendChild(saveas);
0

精彩评论

暂无评论...
验证码 换一张
取 消