js下載文件

本文的前提是：後臺給的是一個能夠下載的url的狀況下的下載：

怎樣的文件url才能觸發瀏覽器的下載行爲?（轉自SF）

能觸發瀏覽器下載的url有兩類:

• response header中指定了Content-Disposition爲attachment，它表示讓瀏覽器把響應體做爲附件下載到本地 (通常Content-Disposition還會指定filename, 下載的文件默認就是filename指定的名字)

• response header中指定了Content-Type 爲 application/octet-stream(無類型) 或者 application/zip(下載zip包時)以及其它幾個不常見類型 (其中還有瀏覽器差別)，其中 application/octet-stream表示http response爲二進制流(沒指定明確的type), 須要下載到本地, 由系統決定或者用戶手動指定打開方式。

在這種前提下，只須要瀏覽器請求了這個地址，都會自動下載，具體的方式以下：

一、iframe 　　加載請求此地址時會自動下載  //聽說兼容先較好，推薦，使用的時候吧iframe設置爲display;none便可

　　<iframe name="hehe" src='下載url'></iframe>

二、a 　　　　點擊請求此地址時會自動下載

　　<a href="下載url">下載</a>

　　H5的download屬性 <a download href="下載url">下載</a> 這時候，若是返回的是img這種瀏覽器能夠打開的文件時，也會下載（不然會直接打開）

三、form 　　 發起submit請求此地址時會自動下載

<form 
   action="下載ur"
   method="get" 
>
   <button type="submit">下載</button>
</form>

四、window.location.href  賦值爲此地址時會自動下載 ，若是是其餘地址，會跳轉，但，當是下載的url，瀏覽器會發起請求，下載下來，而且不會改變本頁的 window.location.href

　　window.location.href = 「下載url」

四、window.open  　　　　賦值爲此地址時會自動下載 ，但會先打開新標籤頁再下載再關閉新標籤頁，體驗不佳

　　window.open = 「下載url」

 

 

總之：只要是下載的url，只要讓瀏覽器發起請求，都會實現下載的功能；具體是什麼緣由，有待後期的學習。（我司是汪大神，分分鐘就說出了這個規律，想必必然有基礎理論的支持，也許是HTTP請求、或者後臺知識的）