1. 程式人生 > >在markdown中直接插入base64編碼的圖片

在markdown中直接插入base64編碼的圖片

經常寫一些東西,但是一直被如何分享與遷移這些東西困擾。比如從onenote和word沒辦法快速的釋出到csdn(本來有介面的,但是csdn現在不提供了)。釋出到csdn的內容不能直接完整的複製下來繼續編輯,格式會完全亂掉。

markdown是一個不錯的答案,以文字的方式表達格式,走到哪都沒問題。但是還是不夠完美,因需要為圖片搞個圖床。這不就更麻煩了嘛。圖床用不了咋辦。。

想到了一個typora+base64+圖片壓縮的勉強的解決方式。因為我平時寫的部落格都是截圖示意一下,並不複雜,圖也不大。

具體操作步驟如下:
1. 截圖之後儲存圖片。
2. 用線上網站壓縮:http://www.bejson.com/ui/compress_img/


(推薦使用80以上的壓縮比,能看清就行)
3. 壓縮完成之後,用此網站線上base64編碼:http://imgbase64.duoshitong.com/
4. 將base64複製下來。用以下語法表示圖片:

![image][link1]
我是內容…..^_^
[link1]:data:image/png;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDACMYGh4aFiMeHB4nJSMpNFc4NDAwNGpMUD9Xfm+EgnxveneLnMipi5S9lnd6ru2wvc7V4OLgh6f1//PZ/8jb4Nf/2wBDASUnJzQuNGY4OGbXj3qP19fX19fX19fX19fX19fX19fX19fX19fX19fX19fX19fX19fX19fX19fX19fX19fX19f/wAARCAAzAIEDASIAAhEBAxEB/8QAGAABAQEBAQAAAAAAAAAAAAAAAAEDAgT/xAAeEAEBAAICAwEBAAAAAAAAAAAAAQIRAzESIUEiQv/EABgBAQEBAQEAAAAAAAAAAAAAAAABAgQD/8QAGREBAQEAAwAAAAAAAAAAAAAAAAERAiFB/9oADAMBAAIRAxEAPwDtVHW40FAQUBBdAqCgIoACgIKIIKAgoCCgAAA6mNvTTj4plfaW41JaxG2fBZb43bK42dwllSyxBRRFAAUBBQEFARZNgga9LMdppZddC9NMMcf6byTX5rybrrHkyx6Ysrc5R6ddeTnlwmfpnOe/YXm38TKuys8sLj25aXk3NWOG487niCiiGlAQXQCAAoAAAAAAAAAAAKAgAA//2Q==

這樣做的缺點就是文章太長。經過測試,插入10張圖片typora已經開始卡頓,而且typora居然不支援ctrl+shift+end/home這個快捷鍵,有點失望。

不過把base64連結放到notepad中編輯(設定不自動換行),文章寫好之後,最後複製過來,還是比較能接受。像這樣:
image

不過,可以看出,這個整個步驟還是比較繁瑣。要是能有個截圖工具可以直接設定壓縮比然後得到base64編碼就比較完美了。(可以考慮動手擼一個…)

目前來看,還是能夠接受的啦,睡啦。晚安,世界!

參考:
將圖片內嵌入Markdown文件中