Tải xuống tài nguyên trong Google Chrome Extension

Question

Tôi đang viết một tiện ích mở rộng của Google Chrome cho phép bạn tải xuống tệp sao lưu dữ liệu của mình. Tôi muốn người dùng có thể nhấn nút và hộp thoại "Lưu dưới dạng" sẽ mở và họ có thể lưu tệp vào máy tính của họ. Không có gì xuất hiện để làm việc và tôi đã không tìm thấy câu trả lời trên internet. Tôi đã thử nhiều phương pháp:

1. Sử dụng document.execCommand('SaveAs', null, 'filename.json'); này không hoạt động vì lệnh này là IE chỉ và có không xuất hiện như một Webkit-thay thế
2. Sử dụng URI dữ liệu. Đây là triển vọng nhất và hiệu quả trong Opera và Firefox, nhưng vấn đề là cả Chrome và Safari đều không hỗ trợ Content-disposition = attachment; -header trong URI. Điều này nên hoạt động. (Chrome thậm chí không cho phép tôi ctrl/cmd+s một trang từ URI dữ liệu)
3. Sử dụng XMLHTTPRequest. Tôi đã không thử điều này, nhưng phải có một số cách mà bạn có thể chuyển tiếp yêu cầu xung quanh? Xin lưu ý rằng tôi không muốn sử dụng máy chủ bên ngoài (trong trường hợp đó tôi có thể chỉ cần gửi yêu cầu POST và áp dụng Bố cục nội dung: -header)
4. Sử dụng API tiện ích mở rộng của Chrome. Nhưng dường như không có gì cho mục đích này.

Lý do tôi không muốn sử dụng bất kỳ máy chủ bên ngoài nào là tôi không muốn phải trả tiền cho lưu trữ và dữ liệu được gửi có thể nhạy cảm với người dùng và tôi không muốn xâm phạm quyền riêng tư của bất kỳ ai.

Có ai đã làm việc này không?

Answer 1

Tôi đã làm như sau trong mã Appmator trên Github.

Cách tiếp cận cơ bản là xây dựng Blob của bạn, tuy nhiên bạn muốn (Chrome/WebKit/Firefox có responseBlob trên XmlHttpRequest để bạn có thể sử dụng), tạo iframe (ẩn, hiển thị: none) rồi gán src của iframe là Blob.

Thao tác này sẽ bắt đầu tải xuống và lưu nó vào hệ thống tệp. Vấn đề duy nhất là, bạn không thể đặt tên tệp.

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);