我一直在尋找一個前端JS解決方案來解決這個問題/在瀏覽器中強制下載文件的概念。基本上,我想讓瀏覽器通過js事件下載文件。我知道在HTML5中我們有下載屬性,但它只在Chrome中受到支持,最終用戶仍然需要實際點擊鏈接,我無法觸發它。但缺乏瀏覽器支持對我的需求來說更成問題。強迫文件下載與PHP頭影響我的帶寬?
所以,我以爲我會使用PHP和「內容處置:附件」這是偉大的工作,但現在它的服務器端的代碼,我不知道是否會影響我的帶寬。下載的文件是外部文件,並不在我的服務器上。
此外,雖然「download.php?file = http://domain.com/image.jpg」爲我下載文件,我無法弄清楚如何通過ajax請求下載以「下載.php?file = http://domain.com/image.jpg「
任何想法?
這裏是PHP代碼的一部分:
header("Content-Disposition: attachment; filename=\"".basename($filename)."\";");
header("Content-Transfer-Encoding: binary");
readfile("$filename");
好,以及啓動對前端下載一個辦法是應用X-框架,選項報頭的download.php然後在iframe中打開圖像,作爲內容添加到的download.php:
header('X-Frame-Options: DENY');
然後做到這一點用JS/jQuery的:
$("body").append(<iframe src="download.php?file=http://domain.com/image.jpg"></iframe>);
但是我仍然在使用download.php並且會得到一個帶寬成本,所以它並不理想。任何其他想法?我只想在頁面上顯示一堆圖像,並允許用戶單擊一個按鈕將它們全部下載。圖片不是由我託管的,我不想帶寬受到影響。
在下載HTML5屬性而言,不能夠觸發它,jQuery的點擊或觸發點擊失敗,但是這個代碼確實讓我來觸發程序下載:
var clickEvent = document.createEvent("MouseEvent");
clickEvent.initMouseEvent("click", true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
$("a")[0].dispatchEvent(clickEvent);
但是,這個下載屬性只在Chrome中支持,所以我越來越近,但還沒有。任何人?
你能顯示一些代碼嗎?你的問題到底是什麼 - 我不太瞭解Ajax如何進入這裏 – 2012-02-14 17:32:16
Ajax無法做文件下載 - 這是一個後臺操作。您需要使用'window.location ='download.php .....「來強制執行前臺操作。 – 2012-02-14 17:40:42
我下載的php文件效果很好,你去它下載一個在查詢中指定的文件,當我去download.php?file = http://domain.com/image.jpg - 它下載http:// domain.com/image.jpg,但我正嘗試下載多個文件,因此我想爲每個文件的download.php調用(ajax調用)。我可以讓ajax調用返回圖像,但不能下載它。 – iwek 2012-02-14 17:42:59