5

Piszę rozszerzenie przeglądarki Google Chrome, które umożliwia pobranie pliku kopii zapasowej danych. Chcę, aby użytkownik mógł nacisnąć przycisk, a okno dialogowe "Zapisz jako" powinno się otworzyć i zapisać plik na swoim komputerze. Nic nie działa i nie znalazłem odpowiedzi w Internecie. Próbowałem kilka podejść:Wymuszenie pobrania w rozszerzeniu Google Chrome

  1. Korzystanie document.execCommand('SaveAs', null, 'filename.json'); ten nie działa, ponieważ to polecenie jest IE-only i nie wydaje się być Webkit-alternatywa
  2. Korzystanie URI danych. To było najbardziej obiecujące i działało w Operze i Firefoksie, ale problem polega na tym, że ani Chrome, ani Safari nie wydają się obsługiwać Content-disposition = attachment; -header w URI. Ta powinna działać. (Chrome nawet nie pozwala mi uzyskać ctrl/cmd+s strony z URI danych)
  3. Korzystanie z XMLHTTPRequest. Nie próbowałem tego, ale musi być jakiś sposób, w jaki mógłbyś przekazać prośbę dookoła? Należy pamiętać, że nie chcę używać zewnętrznego serwera (w takim przypadku mógłbym po prostu wysłać żądanie POST i zastosować dyspozycję treści: nagłówek)
  4. Korzystanie z dostępnego interfejsu API rozszerzenia Chrome. Ale wydaje się, że nic nie ma w tym celu.

Powodem, dla którego nie chcę korzystać z zewnętrznego serwera jest to, że nie chcę płacić za hosting, a dane wysyłane mogą być wrażliwe na użytkownika, a ja nie chcę naruszać czyjąś prywatność.

Czy ktoś to zrobił?

+2

zobaczyć http://stackoverflow.com/questions/4003352/chrome-extension-download-export-content-created-on-the-fly – serg

Odpowiedz

3

Zrobiłem to w kodzie Appmatora na Github.

Podstawowym podejściem jest zbudowanie twojego Bloba, jakkolwiek chcesz (Chrome/WebKit/Firefox ma element ResponseBlob na XmlHttpRequest, więc możesz go użyć), utwórz element iframe (ukryty, display: none), a następnie przypisz src iframe być Blobem.

Spowoduje to pobranie pliku i zapisanie go w systemie plików. Jedynym problemem jest to, że nie możesz jeszcze ustawić nazwy pliku.

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

jestem chyba ślepy, ale gdzie dokładnie jest dokładnie powstanie kropelka w twoim kodzie? Gdzie mam umieścić "URL" (lub xmlhttprequest)? –

+0

Ten kod jest obecnie nieaktualny, ale za pośrednictwem BlobBuilder i bb.append() – Kinlan

+0

... jak to zrobić z kodem "nieaktualnym"? (Znalazłem tę odpowiedź przez google ...) –

Powiązane problemy