軟體: no-ip, PostgreSQL, and commento.
5. 免費網址
如果你跟我一樣家裡的網路只有服浮動ip，但是也想把自己的網頁拿給不同屋簷下的朋友看，那就必須取得一個能在網際網路上尋到你家的網址。這個願望可以透過noi-ip這間第三方公司達成。我們需要在no-ip註冊一個帳號，然後在Dashboard裡的Quick Add填入你的網站名，我是填寫上一篇的<the site name>，然後在下面的網域名Domain當中選一個你看得順眼的，就能點擊綠色按鈕"Add Hostname"，擁有這個網址。免費帳號允許創建三個網址。創建好的網址可以點選左邊Dynamic DNS分頁看到。免費帳號的缺點就是沒有HTTPS，而且每隔30天就要收信點一下確認續約的按鈕，確保你的讀者可以繼續透過同一個網址看到你的部落格網站(這有點不夠符合本站初心阿，看在免費，湊合著用吧)。
 |
 |
|---|---|
| no-ip dashboard | no-ip ddns |
有了屬於自己的網址之後，我們還不能透過這個網址連進樹莓派，我們必須在樹莓派上安裝Dynamic Update Client(DUC)，幫我們回報家裡的浮動ip給no-ip。登入樹莓派之後，我們輸入
$ sudo mkdir <no-ip folder>; cd <no-ip folder>
$ wget http://www.noip.com/client/linux/noip-duc-linux.tar.gz
$ tar -xvf noip-duc-linux.tar.gz
$ cd no-ip-2.1.9-1; make install
前三行下載並且解壓縮noip2到我們創建來存放noip程式碼的資料夾<no-ip folder>，但是這只是原始碼，我們必須在樹莓派上編譯才能得到app。第四行就是進入解壓縮得到的資料夾並且編譯，編譯完成自動安裝到`/usr/local/bin/。然後就要設定noip2
$ /usr/local/bin/noip2 -C
需要填入no-ip網站上註冊的帳密與剛創立給我們部落格的網址。再來官方的文件裡說README裡有教我們如何寫開機自動啟動的noip2 service，但是我沒能按照他的指示成功，於是我自己搞一個簡單一點的service。
sudo vi /etc/systemd/system/noip2.service
把以下幾行填入編輯器
[Unit]
Description=noip2 service
[Service]
Type=forking
ExecStart=/usr/local/bin/noip2
Restart=always
[Install]
WantedBy=default.target
儲存後離開並且在命令行輸入
$ sudo systemctl start noip2
$ sudo systemctl enable noip2
每次開機就讓systemd直接執行noip2對no-ip更新我們家裡的浮動ip。現在應該可以在www.noip.com網頁的Dynamic DNS分頁下方看到自己家的浮動ip已經更新給自己建立的網址了。
到了這裡還不能從外部網路以自己創立的noip網址開啟部落格，還必須打開自己家裡的router控制頁面來設定port forwarding，通常在瀏覽器網址框裡輸入192.168.0.1就可以登入router了。登入之後找找看Advanced Setting裡面有沒有Port Forwarding，我們要把樹莓派在家裡的內部網址以及HUGO server使用的埠1313，轉給外部的埠80。
 |
|---|
| Motorola router port forwarding |
我家router的轉埠設定如上圖所示。這樣一來家裡區域網路以外的人只要輸入你給的no-ip網址，就能導向你家的浮動ip埠80，然後router接力把外部要求訪問埠80的請求轉給樹莓派的埠1313，對上HUGO server的所有設定。
6. Commento留言區
朋友看了我跌跌撞撞架起來的超陽春部落格，不禁問了有沒有給回饋的地方呀？我才想到一般部落格的文章底下都會有訪客留言討論串，但是HUGO SSG就只能架靜態網站，讓訪客留言了等於部份修改網頁內容，那麼HUGO可不管這件動態的事。所以這裡我們需要訴諸HUGO以外的留言區補釘"Commenting Service"，網路上最多人使用的開源免費討論區就是Disqus跟Commento。其他的方案還有很多，比如說臉書也有提供免費的Facebook Comments，條件式收費的Talkyard、Staticman、或者GraphComment，但我這次搭建部落格的目標是盡可能使用免費軟體來完成一切的功能，於是留在我桌上的選項就只剩下Disqus跟Commento。
簡單地做點功課之後了解網路上評價說架設難度來講，比較簡單的是Disqus，但是他的好日子已經過去了，被廣告商收購之後，他會追蹤使用者的cookies來投放廣告，這點讓很多人反感。於是我決定試試看有點難安裝但是完全免費開源不搞追蹤的Commento，即使他不那麼fancy，只要能有些陽春的留言功能我就可以接受，畢竟吳董事長的製藥理念是先研究不傷身體，再講求藥效。
Commento的系統需求是需要有個PostgreSQL資料庫伺服器，然後Commento自己也會啟動一個伺服器去訪問PostgreSQL伺服器。運作機制就是每當有讀者在我的文章下面留言，HUGO伺服器會要求Commento伺服器做出網頁更動，Commento伺服器就會存取PostgreSQL伺服器寫入該讀者的留言到資料庫中，方便以後其他使用者讀取留言傳回Commento產生留言串，在傳回HUGO伺服器重新產生頁面。
如果加上原本的HUGO伺服器，那就有三個伺服器要運行。好樣的，為了讓未來廣大的讀者們留言回饋意見，我也只能賭賭看三個伺服器全部塞進樹莓派之後不會讓他燒起來，要知道我在第一篇的硬體踩坑歷程，為了達到省電與靜音，已經決心採用無風扇全鋁機殼來使用室內氣溫散熱。要是哪天萬人湧入，而且又瘋狂留言……挺住別死阿！阿莓。
$ sudo apt install postgresql
一行安裝PostgreSQL，接著進行設定
$ sudo -u postgres psql
這行以postgres使用者的身份啟動psql資料庫，接下來命令提示字元(command prompt)會變成"postgres=#"，我們以"#“省略
# create database commento_db;
# create user commento_user with encrypted password '12345';
# grant all privileges on database commento_db to commento_user;
# \q
這樣一來我們就建立了一個給commento的資料庫commento_db，以及一個擁有所有資料庫找查排序權限的使用者commento_user，其密碼為12345。讀者可以自行修改這些名稱以及密碼，但要注意這裡的使用者名稱不區分大小寫，可是密碼有區分大小寫，而且密碼必須用單引號框住。由於我對資料庫語法不熟悉，一開始在這裡卡了好久，等到我意識到大小寫的問題之後，已經浪費了快兩個小時，坑殺新手阿！
離開恐怖的資料庫命令行之後，還有兩個檔案要修改一下才能讓commento伺服器正確存取PostgreSQL伺服器，
$ sudo vi /etc/postgresql/11/main/postgresql.conf
在檔案末尾加入
listen_addresses='*'
允許所有ip連入。如果有要修改PostgreSQL伺服器的連接埠，也可以修改port = 5432這行，但是你改動了什自己要記下來待會填給Commento伺服器的設定。另外還有一個關於用戶授權的檔案也需要編輯一下
sudo vi /etc/postgresql/11/main/pg_hba.conf
在檔案末尾加入
host all all 0.0.0.0/0 md5
授權所有客戶。你可能會奇怪，為什麼資料庫伺服器的設定好像挺隨意寬鬆的？答案就是這個PostgreSQL伺服器只會對內部網路開放，讓Commento伺服器訪問而已，他永遠有備入侵的風險，但是比較低，如果覺得不放心，等Commento的設定都完成之後在回頭縮限PostgreSQL伺服器的應答範圍就好。接著啟動PostgreSQL。
$ sudo ufw allow 5432
$ sudo systemctl start postgresql
$ sudo systemctl enable postgresql
第一行讓樹莓派開啟埠5432，後兩行啟動PostgreSQL伺服器等待Commento連入。這樣就完成Commento官網所說的prerequisite了(嗎？)我一開始也這認為。
Commento提供三種安裝方式，下載官方預先編譯好的binay來執行、使用Docker來省略安裝過程、以及下載程式碼在自己的機器上編譯。可惜我在官方的Using Release Binaries頁面上找不到適合樹莓派的版本。第二種方法要讓樹莓派能運習Docker，我目前想進可能跑原生的程式，不要加重樹莓派的負擔，所以只剩下第三種方法，自己在樹莓派上從原始碼開始編譯出執行檔。好吧，編就編吧，交給你了小莓(拍肩)
$ sudo apt install build-essential golang go-dep
$ mkdir <commento project>; cd <commento project>
$ git clone https://gitlab.com/commento/commento.git
$ cd commento
$ make prod
第一行安裝了Go語言，其實我在這之前就為了安裝HUGO而安裝過GO語言囉，但我還不確定HUGO運行須不需要GO語言，所以寫在這裡給還沒安裝GO語言的人參考。第二到第四行取得commento程式碼，最後一行編譯commento產品。但是編譯開始沒多久就出現錯誤訊息。這個編譯過程需要yarn，我的樹莓派上還沒有，於是我使用$ sudo apt install yarn，然後就很荒謬的在編譯到yarn install的時候又出錯"No such file or directory: ‘install’"，查了好久才了解到原來透過apt安裝的yarn會順便安裝cmdtest，但又不能單純移除cmdtest，好在有人發現了移除apt所安裝的cmdtest與yarn之後，改用sudo apt-get install yarn就不會有錯誤啦。(眼神死)
編譯成功之後，會在build/prod/資料夾裡出現可執行檔commento。接下來我們需要設定一些環境變數給commento，讓他知道要從哪裡收到資料庫找查增刪需求，又要去哪裡找到資料庫。在這裡我就直接把環境變數的設定寫進去Bash設定裡
$ vi ~/.bashrc
打開設定檔之後把以下幾行填到檔案末尾
export COMMENTO_ORIGIN=http://<your site's no-ip address>:<WAN port for commento>
export COMMENTO_BIND_ADDRESS=<the designated LAN ip>
export COMMENTO_PORT=<LAN port for commento>
export COMMENTO_POSTGRES=postgres://commento_user:12345@<the designated LAN ip>:5432/commento_db?sslmode=disable
export COMMENTO_FORBID_NEW_OWNERS=false # Allowing registering new user
#export COMMENTO_FORBID_NEW_OWNERS=true
第一行設定了外部網路訪問Commento伺服器的網址跟外網埠，沒錯，Commento也會產生一個頁面，而這個頁面就是我們的Commento後台，他可以跟部落格同網址，但是不能讓連接埠衝突。這裡我是填入no-ip上創建的網址，以及一個不同於80的連接埠，因為我要把80留給部落格伺服器。第二與第三行把Commento伺服器的區域網路位址綁定樹莓派的網位址，也給他一個不同於HUGO server的連接埠，所以這裡要避免1313。第四行告訴Commento去那找PostgreSQL伺服器，他也在樹莓派上，所以就是同樣的區網位址但是連接埠是5432，也把資料庫帳號密碼以及資料庫名稱寫在這行。看吧，這裡也是要曝光資料庫伺服器的帳密，好佳在我們不需要把資料庫伺服器對外開放，不然每次有讀者留言，系統就要來找我們要訪問資料庫伺服器的帳號密碼。第五行跟第第六行一次只註解掉一行就可以，只有在地一次登入Commento後台頁面創建管理者帳號才使用第五行，否則使用第六行禁止創建新的管理者帳號。編輯完成後存檔離開。
你可能會問，那麼路人讀者怎留言，很簡單，還沒帳號的人可以在留言之前註冊一個帳號，只需要留下email，設定密碼跟顯示名稱。如果讀者堅持不想創帳號，也能勾選匿名就能留言啦。兩種選擇如下圖所示。
 |
 |
|---|---|
| Commento: Register to comment | Commento: Anonymously comment |
接著我們就能啟動Commento伺服器。假定我們的路徑還在commento資料夾。
$ source ~/.bashrc
$ sudo ufw allow <LAN port for commento>
$ ./build/prod/commento
第一行使環境變數生效，第二行開啟樹莓派的埠，允許HUGO伺服器連接Commento伺服器。第三行啟動Commento伺服器。
打開瀏覽器，在網址列輸入你家router ip，在設定一組Port Forwarding給Commento伺服器，外網的連接埠是上面的<WAN port for commento>，內網位址是，轉給樹莓派上的埠。這樣才打通Commento後台頁面，現在開新的瀏覽器分頁前往https://<your site's no-ip address>:<WAN port for commento>就能看到Commento了，創建一個管理者帳號並且登入進去，點選右邊”+ New Domain"，就可以填入網站名與no-ip網址。填完點擊"ADD DOMAIN"
 |
 |
|---|---|
| Commento: Owner login page | Commento: Add domain |
新增完Commento domain之後在網頁左邊點擊這個剛剛建立的Domain就能看到"Installation Guide"分頁有一行Universal Snippet，如果把這行html程式碼嵌入HUGO主題當中，就能在每篇文章下面出現留言區了。
 |
|---|
| Commento: Installation Snippet |
複製這段html程式碼之後，我們需要編輯HUGO主題
$ vi ./themes/<your theme's name>/layouts/_default/single.html
把剛剛複製到的html程式碼貼到{{ .Content | emojify }} 與</article>之間。現在開始你的每篇文章底下都開放留言了。