通用下載方法,通過Blob的方式,訪問Url地址,下載對應的圖片,excel等文件。
axios({method: "get",url,responseType: "blob",}).then((res: any) => {const link = document.createElement("a");const blob = new Blob([res], { type: res.type });link.style.display = "none";link.href = URL.createObjectURL(blob);link.download = decodeURI(fileName);document.body.appendChild(link);link.click();document.body.removeChild(link);}).catch((error) => {console.log(error);reject(error?.data || error?.result);});
復現
其他都沒什么問題,但下載jpg圖片的時候,下載之后沒有后綴,而且打不開。
圖標還是磁盤!!
分析排查與解決
發現獲得文件類型是image/jpg。
查看了一下content-type。
一.什么是content-type?
MediaType,即是Internet Media Type,互聯網媒體類型;也叫做MIME類型,在Http協議消息頭中,使用Content-Type來表示具體請求中的媒體類型信息。
類型格式:Content-Type: type/subtype; parameter1=“value1” parameter2=“value2” …
type 是主要類型,表示數據的基本類別。
subtype 是次要類型,更具體地描述數據內容。
parameter 是可選的參數,它們可以提供關于內容類型的更多信息,例如字符集、編碼等。
解決方案:
而對應的jpg類型是image/jpeg
如果把類型修改之后下載是成功的!
image/jpeg和image/jpg區別是啥?
image/jpg 和 image/jpeg 在實際的MIME類型定義中,存在顯著的區別,但主要是基于準確性和習慣用法的考慮。以下是關于這兩個MIME類型的詳細解釋和區別:
準確性:
- image/jpeg:這是JPEG圖像文件的正確MIME類型。JPEG是“Joint Photographic Experts Group”的縮寫,它代表了一個由多個組織組成的聯合委員會,負責制定JPEG標準。JPEG標準是一種廣泛使用的圖像壓縮標準,可以支持24位顏色,但不支持Alpha通道(即透明度)。
- image/jpg:這不是一個標準的MIME類型。雖然在一些情況下,它可能被用作JPEG圖像的MIME類型,但這并不準確。這種用法可能是基于某些歷史原因或誤解。
歷史原因:
在早期的Windows版本中,由于文件系統對文件擴展名的長度有限制(通常只允許三個字符),因此.jpeg擴展名有時被縮短為.jpg。但這種限制在現代操作系統中已不再存在。
然而,由于.jpg已經廣泛使用,并且得到了廣泛的兼容性支持,它成為了JPEG圖像文件的默認或標準擴展名。
使用建議:
- 在定義MIME類型時,應該使用image/jpeg而不是image/jpg,以確保準確性和兼容性。
- 當在Web服務器、HTTP請求頭或任何其他需要指定MIME類型的上下文中指定JPEG圖像的MIME類型時,應始終使用image/jpeg。
JPEG的特點:
- JPEG是一種有損壓縮格式,這意味著在壓縮過程中會丟失一些圖像數據。然而,由于這種壓縮方式非常高效,JPEG圖像可以在保持相對高質量的同時,顯著減少文件大小。
- JPEG壓縮是基于離散余弦變換(DCT)的,這是一種由電氣工程師Nasir Ahmed在1972年首次提出的有損圖像壓縮技術。
總結:image/jpg并不是一個標準的MIME類型,而image/jpeg是JPEG圖像文件的正確MIME類型。在使用時,應始終選擇image/jpeg以確保準確性和兼容性。