網頁載入圖檔，可否做到不用理會格式？ - iT 邦幫忙::一起幫忙解決難題，拯救 IT 人的一天

0

網頁載入圖檔，可否做到不用理會格式？

檔案格式不分檔案格式

MoMoDIYer 2021-08-17 09:43:46 ‧ 1056 瀏覽

分享至

我想問的問題是，通常網頁之圖片，都是指定了檔名及格式，如（.jpg/.png/.webp)，

<img src='./4.jpg'>

我就想問，有否簡單做法，就可以不分檔案格式，就能減少維顧時間，更不怕打錯檔案格式而顯示出錯。

看更多先前的討論...收起先前的討論...

japhenchen iT邦超人 1 級 ‧ 2021-08-17 09:47:07 檢舉

img 只是載入檔案，並沒有要求你設定ContentType說明格式啊，你是想連副檔名都不想加入嗎？還是你想載入的是base64的資料字串？

純真的人 iT邦大師 1 級 ‧ 2021-08-17 09:49:57 檢舉

你誤會了什麼...0.0|||

窮嘶發發發 iT邦高手 1 級 ‧ 2021-08-17 09:50:49 檢舉

可以，把所有的圖檔弄好短網址
然後在 SRC 這邊就可以直接打短網址就好了
如果圖檔多，那弄個資料表管理就好

例如 <img src='https://ppt.cc/fsgJpx'>

japhenchen iT邦超人 1 級 ‧ 2021-08-17 10:05:01 檢舉

副檔名是檔案建立時就被附上，而不是由你分辦後才出現的啊..

所以只要把檔名連同副檔名，交給 img 處理即可，你不用理會格式，如果你丟的不是圖檔，大不了看到一個❌而已(如果你沒有加alt取代文字的話)

haward79 iT邦研究生 1 級 ‧ 2021-08-17 10:18:44 檢舉

副檔名的改變不會影響檔案內容
不過可能會影響檔案內容的解碼

你可以嘗試把圖片檔名中的副檔名去掉
例如：dog.jpg 改成 dog
例如：cat.png 改成 cat

然後 img 那邊直接寫成
<img src="dog" />
<img src="cat" />

通常圖片的格式會再自動判讀
圖檔還是出得來

MoMoDIYer iT邦新手 5 級 ‧ 2021-08-20 08:00:14 檢舉

我的情況偏向用 "haward79" 的提義可解決，但想知道有沒有其它風險存在呢？

登入發表討論

直播研討會

{{ item.subject }}

{{ item.channelVendor }} {{ item.webinarstarted }} |

{{ formatDate(item.duration) }}

直播中

3 個回答

0

firecold

iT邦新手 1 級 ‧ 2021-08-17 10:37:56

建立一個專門放圖片的資料夾
編寫htaccess
用Redirect轉就可以

不過有些限制須對檔名進行重新編碼避免重複
還有只能全部轉一種格式ex. 全部跳轉jpg or png

大概就是
https://domain/photo/demo 跳轉到 https://domain/photo/demo.jpg
https://domain/photo/test 跳轉到 https://domain/photo/test.jpg

至於跳轉不同格式檔案的話.......有請其他高人

回應
分享
檢舉

登入發表回應

0

froce

iT邦大師 1 級 ‧ 2021-08-17 10:53:51

我在猜樓主想要的根本不是他說的。
他要的只是一個聰明的IDE能幫他自動完成檔名而已。

你應該管的是靜態網頁吧?

回應 2
分享
檢舉

japhenchen iT邦超人 1 級 ‧ 2021-08-17 13:26:14 檢舉

VisualStudio不就可以用滑鼠拖放的方式，把圖檔拖到HTML裡就變成＜img src="xxxx.yyy"＞了嗎？不用自己刻程式

Homura iT邦高手 1 級 ‧ 2021-08-17 15:02:25 檢舉

覺得用拉的應該不會比智能提示幫你抓出來快XD

登入發表回應

0

japhenchen

iT邦超人 1 級 ‧ 2021-08-17 16:43:49

這是我自己做的小工具，就是不理會副檔名的縮圖工具，只要用滑鼠就能操作
http://60.249.187.158/thumb/

回應 2
分享
檢舉

japhenchen iT邦超人 1 級 ‧ 2021-08-17 16:48:43 檢舉

傳回的圖片就是把上傳的圖片，在後端產生相等比例縮圖傳回base64字串，用img直接顯示，無關檔名

japhenchen iT邦超人 1 級 ‧ 2021-08-17 16:54:25 檢舉

(上例的壓縮過程並無伺服器的檔案操作...all on the fly)

登入發表回應

我要發表回答

立即登入回答

參賽組數

1064 組

團體組數

40 組

累計文章數

22202 篇

完賽人數

602 人

15th鐵人賽 16th鐵人賽 13th鐵人賽 14th鐵人賽 12th鐵人賽 11th鐵人賽鐵人賽 2019鐵人賽 javascript 2018鐵人賽 python 2017鐵人賽 windows php c# windows server linux css react vue.js

IT邦幫忙