把Obsidian變成寫Blog的空間

就這樣經過一個月後,完成了這套天兵的想法
先來看看這套系統的結構
# 看起來超複雜的,但是邏輯基本上是清晰可行的,那就開始來做吧
問題討論
先看看我們總共有哪些技術是需要克服的
技術困難
Hexo
- 如何讓hexo可以在伺服器運行起來,變成一個可以執行指令的容器
檔案雲端
- 我是使用cloudreve作為我的雲端檔案儲存系統,不過要如何把東西同步進去和取出是一個問題
Obsidian
- 我要如何讓檔案可以同步,不是指同步到伺服器,還要在多個裝置上也可以同步
- 因為hexo我又自己寫自己的markdown parser,我要如何讓他在obsidian中呈現出來
- 我要如何在obsidian中可以執行指令
解決方案
# 註:這些都是後來的解決方案
Hexo
Q:如何讓hexo可以在伺服器運行起來,變成一個可以執行指令的容器
後來查詢hexo文檔後發現可以用
1 | hexo.call('command', {arg}) |
來調用hexo指令,不過在中間又出現了一個很大的問題,就是像是hexo server
是沒有提供停止伺服器的指令的,所以需要想停止伺服器只能在console中Ctrl+C
,不過後來解決了(Q2下面)
接著只要再用express
套件寫一個API伺服器執行指令就完成了YAA
Q2:Hexo 沒有停止指令要怎麼辦
翻閱原始hexo-server
套件後發現其實hexo在call這個function時會回傳一個http server
的物件,其中就有提供close()
的fucntion,這樣這個問題就順利解決了….嗎
沒有因為後來發現就算伺服器停止了,但是下次在呼叫時就會出現問題,經過了解後發現可能是因為Hexo本生會去即時監控md檔案的變化即時更新,這可以是一件好事也可以是一件壞事
好事是這樣每次有變動的blog檔案上傳到伺服器不需要重啟整個伺服器
壞事是下次重啟時會出現我也不知道是甚麼的錯誤
那後來是如何解決的呢,問過chatGPT後發現是因為要使用new Hexo()
才能,甚麼意思呢,其實我也不知道,不過我自己推理是這樣啦
1 | 因為hexo每次被呼叫時都會建立一個即時監控檔案系統 |
# 以上純屬猜測,有js大老可以解釋,本人很樂意了解細節
雖然有hexo.exit(); hexo.unwatch()
指令,但是我是過後都沒有效果,所以我最後的解決方案是先建立一個hexo物件
1 | let hexo_instance = new Hexo() |
在hexo server被關閉後自動刪除
1 | hexo_instance = null |
下次如果需要再建立啟動hexo server就在宣告一個新的物件,不過我一開始有擔心這樣記憶體會不會被占滿,問過GPT是說Nodejs有自動回收系統,會把它清理掉,不知道是不是正確的
檔案雲端
Q:我是使用cloudreve作為我的雲端檔案儲存系統,不過要如何把東西同步進去和取出是一個問題
這個就比較簡單了去翻閱Cloudreve後發現她其實有提供API,不過缺點是他不能讀取,如果要讀取只能一次把檔案下載下來,而且因為我需要一次下載大量的檔案,我怕這樣會造成性能問題
好在後來我發現Cloudreve有webdav的功能,並且後來製作發現我一定需要使用這個webdav功能,於是最後來我就決定用webdav來做為同步檔案的系統了
Obsidian
Q:我要如何讓檔案可以同步,不是指同步到伺服器,還要在多個裝置上也可以同步
有玩過Obsidian的都知道他有插件功能,因此在上面搜尋了一下發現有一款插件叫做Remote Sync
,仔細看一下設定發現他支援WebDav的同步方案,回應了剛剛檔案同步的問題,於是就選用他了
Q:因為hexo我又自己寫自己的markdown parser,我要如何讓他在obsidian中呈現出來
這個就真的是一個很大的障礙了,首先Obsidian不支援你直接去改或加入自訂的Parser,經過很長很長的調研,我發現網路上的做法都是把東西放在一個codeblock然後再去渲染,但是…
我覺得很醜
但是還是找不到可以插入自訂markdown 語法的方案,所以最後我決定這樣搞
- 使用者的筆記
- 執行指令後會再./Preview資料夾生成相對的檔案
- 檔案內容為自己的Makrdown Parser產生的Html
- 用預覽模式就可以即時preview自己的Md了
有點簡短,所以這邊再詳細解釋一下
後來我的解決方案是放棄直接用內建的Preview功能,我直接在插件中安裝Makrdown-it
(渲染markdown的套件)渲染html再加上自己的Makrodwn Parser,最後把生成出來的Html放到一個.Md檔案中,再用Obsidian的內建Preview功能預覽我的Html,因為Obsidian不會去編譯我生成出來的html,就這樣…解決了這個困難
雖然做到這就基本上可以使用了,不過為了讓我的使用體驗變好,我加入了自訂更新、自訂同步、自動切分頁等功能,要認真了解在私我或下面問我都會盡力回答
成果展示
Markdown預覽
自製差件指令
雲端檔案同步
Hexo + API 伺服器
相關程式碼
Hexo Server
https://github.com/Whitedragon115/Whitedragon115.github.io/blob/main/index.js