剛入職公司時做了一個移動端上傳圖片並可以預覽的元件，之前也有業務組用過，沒發現什麼問題，但是這次出現了兩個很詭異的問題。
一個是有個老資料的圖在ios下不顯示，另一個是圖片點選預覽只顯示一部分載入不全。之所以詭異是所有裝置都沒問題就ios下有問題，其中老資料圖不顯示還是ios系統版本13及以下才有的。被這個問題困擾了好幾天，經過一系列艱難排查最終兩個問題都妥善解決。
第一個問題原因是該圖是webp格式的，偽裝成了jpg格式（字尾為.jpg）。然而ios13及以下是不支援webp格式的檔案的，所以圖片顯示空白。
第二個問題是這次介面返回的圖片url是在瀏覽器開啟直接下載的，而之前是在瀏覽器直接顯示的，我在預覽元件裡用了loading效果，new 了一個Image物件，賦值url監聽onload事件，然後去除loading再渲染img標籤並給src賦值。這樣導致一個問題就是一張圖片在極短時間裡會被載入兩次。而這次的圖片url又是可以直接下載圖片的，所以ios系統為了節流在第二次img載入圖片時判定重複載入從而終止請求導致圖片只顯示一部分。最後解決方案是把new Image的步驟去掉了，直接賦值給img標籤，然後監聽img標籤的onload事件來判斷loading效果，這樣更直觀。最終完美解決。
