Extensão do Chrome: como salvar um arquivo no disco

Question

Atualmente, estou criando uma extensão para o Google Chrome, que pode salvar todas as imagens ou links para imagens no harddrive.

O problema é que não sei como salvar o arquivo no disco com JS ou com a API de extensão do Google Chrome.

Você tem uma ideia?

Answer 1

Você pode usar Recursos de sistema de arquivos HTML5 para escrever em disco usando o Download API. Essa é a única maneira de baixar arquivos para o disco e é limitado.

Você pode dar uma olhada no plug -in NPAPI. Outra maneira de fazer o que você precisa é simplesmente enviar uma solicitação para um site externo por meio da postagem XHR e outra solicitação GET para recuperar o arquivo de volta, que aparecerá como uma caixa de diálogo Salvar arquivo.

Por exemplo, para minha extensão do navegador Meus hangouts Criei um utilitário para baixar uma foto da tela HTML5 diretamente para o disco. Você pode dar uma olhada no código aqui capture_gallery_downloader.js O código que faz isso é:

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

Se você quiser a implementação de converter um URI em uma bolha no HTML5, aqui está como eu fiz:

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

Depois que o usuário clica no botão de download, ele usará a API de arquivo html5 "Download" para baixar o BLOB URI em um arquivo.

Answer 2

Há muito que desejava fazer uma extensão do Chrome para fazer o download de imagens em lote. No entanto, toda vez que ficava frustrado porque a única opção aplicável é o NPAPI, que o Chrome e o Firefox parecem não desejar mais apoiar.

Eu sugiro que aqueles que ainda queriam implementar a funcionalidade 'salvar arquivo no disco' para dar uma olhada nisso Postagem de Stackoverflow, o comentário abaixo deste post me ajuda muito.

Agora desde o Chrome 31+, o chrome.downloads API ficou estável. Podemos usá -lo para baixar programaticamente o arquivo. Se o usuário não definiu o ask me before every download Opção Avançada na configuração do Chrome, podemos salvar o arquivo sem solicitar o usuário a confirmar!

Aqui está o que eu uso (na página de fundo da extensão):

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

Embora seja uma pena que o Chrome ainda não forneça um Event Quando o download é concluído.chrome.downloads.downloadA função de retorno de chamada é chamada quando o download begin com sucesso (não concluído)

A documentação oficial sobre chrome.downloadsé aqui.

Não é a minha ideia original sobre a solução, mas eu postei aqui esperando que ela possa ser usada para alguém.

Answer 3

Não há como eu saber para salvar silenciosamente arquivos na unidade do usuário, que é o que parece que você espera fazer. Eu acho que você pode pedir que os arquivos sejam salvos um de cada vez (solicitando o usuário a cada vez) usando algo como:

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

Se você quiser solicitar apenas o usuário uma vez, poderá pegar todas as imagens em silêncio, feche -as em um pacote e faça com que o usuário faça o download. Isso pode significar fazer xmlHttPrequest em todos os arquivos, fechando -os em JavaScript, carregando -os para uma área de preparação e perguntando ao usuário se eles gostariam de baixar o arquivo zip. Parece absurdo, eu sei.

Existem opções de armazenamento local no navegador, mas elas são apenas para uso do desenvolvedor, dentro da caixa de areia, até onde eu sei. (Por exemplo, cache offline do Gmail.) Veja anúncios recentes do Google Like Este.

Answer 4

Considere usar o Recursos de sistema de arquivos HTML5 Isso torna possível escrever para arquivos usando JavaScript.

Answer 5

Google WebStore
Github

Fiz uma extensão que faz algo assim, se alguém aqui ainda estiver interessado. Ele usa um xmlHttPrequest para agarrar o objeto, que, neste caso, presume -se que seja uma imagem, depois faz um objeto, um link para esse objecturl e clica no link imaginário.

Answer 6

Desde JavaScript Hitches para o seu computador com páginas da web de quase quase qualquer lugar, seria perigoso dar a capacidade de escrever no seu disco.

Não é permitido. Você está pensando que a extensão do Chrome exigirá interação do usuário? Caso contrário, pode se enquadrar na mesma categoria.