Rozszerzenie Chrome: jak zapisać plik na dysku

Obecnie tworzę rozszerzenie dla google chrome, które może zapisywać wszystkie obrazy lub linki do obrazów na dysku twardym.

Problem w tym, że nie wiem jak zapisać plik na dysku z JS lub z Google Chrome Extension API.

Masz pomysł ?

Author: X-Blaster, 2010-01-28

6 answers

Możesz użyć funkcji systemu plików HTML5 do zapisu na dysk przy użyciu API Download. Jest to jedyny sposób na pobieranie plików na dysk i jest ograniczony.

Możesz rzucić okiem na wtyczkę NPAPI. Innym sposobem na zrobienie tego, czego potrzebujesz, jest po prostu wysłanie żądania na zewnętrzną stronę internetową za pośrednictwem XHR POST, a następnie kolejne żądanie GET, aby odzyskać plik, który pojawi się w oknie dialogowym Zapisz plik.

Na przykład dla rozszerzenia przeglądarki moje Hangouts stworzyłem narzędzie do pobrania zdjęcia z HTML5 Canvas bezpośrednio na dysk. Możesz spojrzeć na kod tutaj capture_gallery_downloader.js kod, który to robi to:

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(':');

Jeśli chcesz implementację konwersji URI na Blob w HTML5 oto jak to zrobiłem:

/**
 * 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);
};

Następnie po kliknięciu przycisku pobierania użytkownik użyje API pliku HTML5 "Pobierz", aby pobrać URI blob do pliku.

 29
Author: Mohamed Mansour,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2013-03-22 17:22:45

Od dawna chciałem zrobić dla siebie rozszerzenie chrome do pobierania obrazów wsadowych. Jednak za każdym razem byłem sfrustrowany, ponieważ jedyną pozornie stosowną opcją jest NPAPI, którego zarówno chrome, jak i firefox wydają się już nie chcieć wspierać.

Proponuję tym, którzy nadal chcieli zaimplementować funkcjonalność "zapisz-plik-na-dysku", aby rzucili okiem na ten post Stackoverflow , komentarz pod tym postem bardzo mi pomógł.

Teraz Od chrome 31+, API chrome.downloads stał się stabilny. Możemy go użyć do programowego pobierania pliku. Jeśli użytkownik nie ustawił opcji ask me before every download advance w ustawieniu chrome, możemy zapisać plik bez pytania użytkownika o potwierdzenie!

Oto, czego używam (na stronie tła rozszerzenia):

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

Chociaż szkoda, że chrome nadal nie zapewnia Event Po zakończeniu pobierania.chrome.downloads.download ' s funkcja wywołania zwrotnego jest wywoływana, gdy pobieranie begin pomyślnie (nie zakończone)

Oficjalna dokumentacja o chrome.downloadsjest tutaj .

To nie jest mój oryginalny pomysł na rozwiązanie, ale zamieściłem tutaj nadzieję, że może się komuś przydać.

 19
Author: Allan Ruin,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2017-05-23 11:54:59

Nie znam sposobu, aby cicho zapisać pliki na dysku użytkownika, co wydaje się, że masz nadzieję zrobić. Myślę, że możesz poprosić o zapisywanie plików pojedynczo (za każdym razem monitując użytkownika), używając czegoś takiego:

function saveAsMe (filename)
{
document.execCommand('SaveAs',null,filename)
}

Jeśli chcesz tylko raz zapytać użytkownika, możesz pobrać wszystkie obrazy po cichu, spakować je w pakiet, a następnie poprosić Użytkownika o pobranie tego. Może to oznaczać wykonywanie XmlHttpRequest na wszystkich plikach, zapinanie ich w Javascript, przesyłanie następnie pyta użytkownika, czy chciałby pobrać plik zip. Brzmi absurdalnie, wiem.

Istnieją lokalne opcje przechowywania w przeglądarce, ale są one tylko do użytku dewelopera, w piaskownicy, o ile wiem. (np. buforowanie w trybie offline Gmaila.) Zobacz najnowsze ogłoszenia z Google jak Ten.

 5
Author: sandover,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2010-01-28 18:41:31

Rozważ użycie funkcji systemu plików HTML5 , które umożliwiają zapis do plików przy użyciu Javascript.

 3
Author: Arnaud Leymet,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2011-08-14 08:01:10

Google Webstore
Github

Zrobiłem rozszerzenie, które robi coś takiego, jeśli ktoś jest nadal zainteresowany. Używa XMLHTTPRequest do przechwycenia obiektu, który w tym przypadku jest uważany za obraz, a następnie tworzy do niego obiekt, link do tego obiektu i klika na wyimaginowany link.

 3
Author: DrJKL,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2012-08-10 04:14:57

Ponieważ JavaScript zaczepki do komputera z stron internetowych z prawie gdziekolwiek, byłoby niebezpieczne dać mu możliwość zapisu na dysku.

To niedozwolone. Czy uważasz, że rozszerzenie Chrome będzie wymagało interakcji użytkownika? W przeciwnym razie może należeć do tej samej kategorii.

 -3
Author: pavium,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2010-01-28 11:16:19