如何解決markdown文件中圖片失效的問題


如何解決markdown筆記移動后,圖片失效的問題。

寫在前面:由於最近經常使用Typora進行.md筆記的編寫,發現.md文件遷移后,就會出現文件中圖片不能正常顯示的問題。故,寫此文以羅列曾踩過的坑以及列出幾種解決辦法。

ps:我最終是將圖片全部保存至sm.ms圖床,用圖片的url替換掉原來.md筆記中圖片的本地路徑鏈接。雖然圖床類工具的穩定性有待商榷,但就目前的使用感來說,sm.ms還算穩定,可以滿足我當下的需求。如果有朋友已經用更好的辦法解決了此問題,希望可以分享一下經驗,可以在文章下方留言評論,感謝。

踩過的坑 and 解決方法如下:

1.使用相對路徑 -坑1

將.md文件中的圖片路徑改為相對路徑。

以Typora為例,具體操作如下:

1th:打開文件 -->偏好設置

2th:找到編輯器 --> 將圖片插入一欄改為: 復制圖片到./${filename}.assets文件夾。

3th:設置好后,當你再在.md筆記中插入圖片時,就會在當前文件目錄下生成一個圖片的文件夾,以后再移動.md筆記時,2者一起移動即可解決移動后圖片失效的問題。

優點:可以解決插入本地圖片后,在本地移動.md文件后,圖片失效的問題。

缺點:若將.md文件上傳到碼雲/博客園/CSDN/開源中國,圖片依然無法正常顯示。

2.將圖片轉存至百度網盤 -坑2

1th:將.md文件里的圖片上傳至百度網盤 -->創建分享鏈接 ,選永久有效。

2th:將分享鏈接在搜狗瀏覽器打開 -->復制圖片的url。 ps:只有搜狗瀏覽器支持此功能。

3th:用該url去替換.md文件中的原有圖片本地地址。再移動/上傳博客園等均不會出現圖片失效的問題。

ps:.md文件中插入圖片的格式為:

![對該圖片的描述](圖片地址)

優點:可以解決.md文件移動/上傳博客園后圖片失效的問題。

缺點:因為圖片在傳輸過程中會被進行壓縮,故會產生圖片失真的問題。此種方法適合對圖片清晰度要求不高的朋友。

3.將.md文件中插入的圖片上傳至碼雲/github - 碼雲的坑(待填)

以碼雲為例:

1th:在碼雲上創建一個個人倉庫用於放.md文件中插入的圖片 -如何建倉庫,大家都清楚,不再贅述。

2th:在本地創建一個文件夾盛放你的圖片,文件夾名稱和倉庫名保持一致;

3th:將該文件夾里的圖片推送至碼雲圖片倉庫;

4th:在你的碼雲項目中找到該圖片,復制圖片的url;

5th:用該url去替換.md文件中圖片的本地地址。

6th:將url中的blob改為raw,圖片即可自動顯示出來。

但是,結果失敗了。查了一些資料后,才清楚,只有github的圖片加速還行,能夠將圖片顯示出來。用碼雲的話,圖片根本加載不出來,只會顯示文字。

故,大家可以將圖片上傳至github,以解決此問題。操作同上。

優點:上傳至github可以完全解決.md文件移動/上傳博客園后圖片失效的問題。且安全穩定,不用擔心圖片丟失的問題。

缺點:只能用github,碼雲圖片加速慢,無法顯示圖片。

(ps:填坑 -.md中插入圖片格式中的()里改成相對地址-即項目根目錄下的地址。參考:https://cloud.tencent.com/developer/article/1333082)

4.將.md文件中插入的圖片保存至圖床

操作方法:把.md文件中要插入的圖片保存到某個圖床服務里,然后獲取該圖片的url,用該url去替換筆記中的原始本地路徑鏈接,然后圖片就能正常顯示了。

以sm.ms圖床為例,具體操作如下:

1th:選擇要上傳的圖片,每次最多上傳10張,每張圖片小於5M。-未登錄狀態最多20張/hour。建議登錄狀態下上傳。

2th:上傳 --登錄后上傳速度快。

3th:上傳完成。復制該圖片的markdown鏈接去替換原.md文件里圖片的本地地址。圖片即可自動顯示出來。

缺點不穩定,保存至圖床的圖片隨時可能丟失。想必微博圖床的事大家都清楚,前車之鑒。有能力的話,建議自己搭建一個個人圖床,另外,這里吐槽一句,PicGo + github比七牛雲 + Mpic要好,因為七牛雲的測試域名收回后,還得去自己備案域名。

優點:可以解決.md文件移動/上傳博客園后圖片失效的問題。

ps:就目前而言,我感覺sm.ms圖床還不錯,不管是穩定性還是上傳圖片的限制,都在可接受范圍內。不過在未登錄情況下,每小時只能傳20張。登錄后,限制取消。

這里給大家推薦幾種免費的圖床

七牛雲:官網地址:https://portal.qiniu.com ,注冊認證后有10G永久免費空間,圖片上傳無限制。但一個月后會收回測試域名,因此你必須要綁定自己的已經備案的域名。

又拍雲:官網地址:https://www.upyun.com ,注冊認證后有10G永久免費空間,圖片上傳無限制。需要綁定自己的已備案域名。

騰訊雲:官網地址:https://cloud.tencent.com ,僅可以使用六個月的免費存儲容量、免費請求和免費流量,圖片上傳限制比較多。具體請參考官網。

sm.ms:官網地址:https://sm.ms ,永久存儲免注冊,圖片鏈接支持https,可以刪除上傳的圖片,提供多種圖片鏈接格式。圖片上傳限制:每個圖片最大5M,每次最多上傳10張。

postimg:官網地址:https://postimages.org ,國外的圖床,永久存儲免注冊,圖片鏈接支持https,可以刪除上傳的圖片,提供多種圖片鏈接格式。圖片上傳限制:對像素和圖片大小有要求。

小結:如果打算長期穩定使用請優先選擇又拍雲或者七牛雲(需要有自己的已備案域名),如果是存儲並不重要的圖片可以使用SM.MS圖床。
寫在最后:如果只在博客園寫博客,則直接將圖片拖進來即可。會自動生成url。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM