Расширение Chrome: Как сохранить файл на диске

в настоящее время я создаю расширение для google chrome, которое может сохранять все изображения или ссылки на изображения на жестком диске.

проблема в том, что я не знаю, как сохранить файл на диске С помощью JS или с помощью Google Chrome Extension API.

У тебя есть идея ?

6 53
javascript google-chrome google-chrome-extension

6 ответов:

можно использовать особенности файловой системы HTML5 для записи на диск с помощью скачать API. Это единственный способ загрузить файлы на диск и он ограничен.

вы можете взглянуть на плагин NPAPI. Другой способ сделать то, что вам нужно, - это просто отправить запрос на внешний веб-сайт через XHR POST, а затем еще один запрос GET для возврата файла, который появится в диалоговом окне сохранения файла.

например, для моего расширения браузера мой Тусовки Я создал утилиту для загрузки фотографии из HTML5 Canvas непосредственно на диск. Вы можете взглянуть на код здесь capture_gallery_downloader.js код, который делает это:

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

Если вы хотите реализовать преобразование URI в Blob в HTML5 вот как я это сделал:

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

затем после того, как пользователь нажмет на кнопку загрузки, он будет использовать "скачать" HTML5 File API для загрузки URI blob в файл.

29

Я давно хотел сделать расширение chrome для себя для пакетной загрузки изображений. Но каждый раз я расстраивался, потому что единственным, казалось бы, применимым вариантом является NPAPI, который и chrome, и firefox, похоже, больше не хотят поддерживать.

Я предлагаю тем, кто все еще хотел реализовать функцию "Сохранить файл на диске", взглянуть на это StackOverflow post комментарий ниже этого поста мне очень помогают.

теперь с тех пор в Chrome 31+, то chrome.downloads API стал стабильным. Мы можем использовать его для программной загрузки файла. Если пользователь не установил ask me before every download предварительная опция в настройках chrome, мы можем сохранить файл без запроса пользователя для подтверждения!

вот что я использую (на фоновой странице расширения):

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

хотя жаль, что chrome все еще не предоставляет Event когда загрузка завершится.chrome.downloads.download функция обратного вызова вызывается при загрузке begin успешно (не на завершено)

официальная документация о chrome.downloadsи здесь.

это не моя оригинальная идея о решении, но я разместил здесь, надеясь, что это может быть кому-то полезно.

19

Я не знаю, как можно молча сохранять файлы на диск пользователя, что, похоже, вы надеетесь сделать. Я думаю, что вы можете попросить файлы, которые будут сохранены по одному (запрашивая пользователя каждый раз), используя что-то вроде:

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

Если вы хотите только один раз запросить пользователя, вы можете молча захватить все изображения, застегнуть их в связке, а затем загрузить их пользователю. Это может означать выполнение XmlHttpRequest для всех файлов, сжимая их в Javascript, Загрузите их в промежуточную область, а затем спросите пользователя, хотят ли они загрузить zip-файл. Звучит абсурдно, я знаю.

в браузере есть локальные параметры хранения, но они предназначены только для использования разработчиком, в песочнице, насколько я знаю. (например, Gmail offline caching.) Смотрите последние объявления от Google, как этот.

5

рассмотрите возможность использования возможности файловой системы HTML5 что делает запись в файлы возможно с помощью Javascript.

3

Google Webstore
Github

Я сделал расширение, которое делает что-то вроде этого, если кто-то здесь еще интересно. Он использует XMLHTTPRequest для захвата объекта, который в этом случае считается изображением, затем делает ObjectURL к нему, ссылку на этот ObjectUrl и нажимает на воображаемую ссылку.

3

Так как Javascript hitch-походы на ваш компьютер с веб-страницами всего около в любом месте, было бы опасно дать ему возможность записывать на свой диск.

Это не допускается. Вы думаете, что расширение Chrome потребует взаимодействия с пользователем? В противном случае он может попасть в ту же категорию.

-3