通過Firefox使用Javascript下載圖片？

我正在致力於Firefox的擴展，現在用JavaScript編寫。本質上，當將鼠標懸停在圖像的縮略圖上時（點擊該圖像將您帶到具有完整圖像的網頁），該擴展程序將查找完整圖像的URL並嘗試通過按鍵進行下載。（在這個例子中是「D」）。我將使用的文件通常是.jpgs和.png，但是.swfs和.mp3s也可能存在。在這一點上，我只是想找到前兩個文件類型的工作。通過Firefox使用Javascript下載圖片？

我現在使用的代碼只是

function ExtendedDownload(image_src) { 
    var a = document.createElement('a'); 
    document.body.appendChild(a); 
    a.download = image_src.split('/').pop().split('?')[0]; 
    a.href = image_src; 
    a.click(); 
}

image_src是URL的形象。
a.download是從完整URL解析的圖像的文件名。

之前在JavaScript文件中，當它看到一個有效的縮略圖被光標懸停時，它會等待按鍵。這部分工作得很好。下載是我遇到的麻煩。

當加載到鍍鉻，該擴建工程完全按預期。然而，在Firefox（v49.0.2）中，它只是顯示圖像（類似於在地址欄中粘貼圖像的鏈接並按下Enter鍵）。這不是預期的效果。

我測試過的一個解決方案是通過JavaScript將圖像轉換爲base64，並試圖下載，這在理論上是有效的，而且我測試過它會將base64轉換爲小的.png ..但是我試圖下載的文件導致base64字符串的大小超過兆字節，並且發送瀏覽器掛起，所以這不是一個有效的選項。

我在stackexchange上遇到的類似問題的每個解決方案都讓我回到了這個位置，然而，「下載」圖像只是在瀏覽器中打開它。

任何建議，將不勝感激。

編輯：我遇到的問題肯定是基於這樣一個事實，即我使用此擴展的網頁和圖像所在的網頁位於不同的域。 @Mayank Pandeyz的解決方案讓我相信這一點，因爲當我嘗試在頁面本身的相同域上進行重新加載和映像時，它就像預期的那樣工作。我有什麼潛力解決這樣的問題？

來源

2016-11-15 Azerai

聽起來像是一個本地系統配置。也許你有像https://addons.mozilla.org/en-US/firefox/addon/open-in-browser/安裝的東西？ – Hailwood

試試這個：

var a = document.createElement('a'); 
a.href = "/favicon.png"; 
a.download = "favicon.png"; 
document.body.appendChild(a); 
a.click(); 
document.body.removeChild(a);

Demo Fiddle

來源

2016-11-15 03:46:01

小提琴演示效果很好，試圖將其實現到我的代碼並不會改變我得到的最終結果。我不確定它與我所在的網站是https的事實有關，還是圖像託管在與主頁面不同的域上？ – Azerai

，你可以做這樣的jQuery中。在那裏你給選擇用戶是否下載

或不

<a href="yourPath" class="download">download</a> 


$('.download').click(function(){ 
      var url = $(this).attr('href'); 
      $(this).attr("target", "_blank"); 
      window.open(url,'Download'); 
     });

這裏是一個小提琴：https://jsfiddle.net/s1ojfbrt/2/

來源

2016-11-15 03:48:11 EaBangalore

你的服務器應該有一個選項，用下面的響應頭提供的圖像：

Content-Type: application/octet-stream 
Content-Disposition: attachment; filename="picture.png"

在這種情況下，瀏覽器將顯示另存爲...對話框。

你可以在服務器上有特殊的url /腳本。

來源

2016-11-15 04:00:28

他正在爲任意網站編寫Firefox擴展。他無法控制服務器。 – Hailwood

@Hailwood這是什麼「我測試過的一個解決方案是將圖像轉換爲base64 ...並試圖下載它，」發生了什麼？ –

我沒有包括轉換的代碼，因爲我沒有保留它，一旦我確定它是一個糟糕的路線下來，但它本質上是一個js函數接受圖像輸入，並輸出一個base64字符串您將分配給a.href而不是原始鏈接。 – Azerai

通過Firefox使用Javascript下載圖片？

回答

相關問題