← view all posts

AWS網域與圖床設置

January 28, 2021
|
同人文-fanfic

Amplify會自動運行Hugo

在Hugo手把手教學文提供的Amplify構建配置，有這麼一行：commands: - hugo -F1

這其實就是在指示Amplify運行系統內建的Hugo軟體，Amplify會偵測content、themes等資料夾，並自動幫我們生成HTML。也就是說，其實本地端不需要提供public資料夾。

奇怪的是這點不管在Hugo官網、或是爬google搜索，都沒有什麼人提起。回去爬曾經參考過的youtbue教學影片，此影片的29:11有提到這一點

那麼在構建配置中的baseDirectory: public實際上是指什麼意思？

  1. 指示Amplify從客戶提供的public資料夾取出資料，or
  2. 指示Amplify運行commands: hugo生成public資料夾，再從中取出資料

我只能猜測，2才是正確的。現有的教學和網路討論好像都忽略了這個問題，很多演示文或影片依然會在本地端生成public資料夾，嚴格說來是多此一舉。那麼不上傳public資料夾實際上有什麼好處？

因為靜態網頁的限制，每新增一篇文章，所有其他文章的html都會因為側欄部件內容變動而被更新，文章一多起來、html生成與傳檔步驟就會越來越耗時間。但Amplify會自動運行Hugo，為使用者生成html網頁，意即用戶每次僅在幾篇文章做小幅度更新時，需要上傳的內容也只有少許md檔，減少本地端作業與傳檔的負擔。

控制Amplify運行的Hugo版本

如果擔心Amplify預設運行的Hugo版本與自己的不合，手把手教學其實已經提出解決方式，這邊再演示一次：

  1. 進入Amplify控制台，指定應用程序
  2. 構建設置 ⇒ Build image settings ⇒ Edit
  3. Live package updates ⇒ Add package version override ⇒ 選擇Hugo
  4. Version欄填入自己需要的版本，以本主題架設時使用的版本為例，填入0.80.0
  5. 點擊保存

為Amplify託管網頁自訂網域

免費送的子網域通常都很醜很難記住，到頭來終究會想要一個固定好記的網址，情況舉例：

  • 託管的網頁已在Amplify部署完成，得到一個隨機生成的子網域master.12345678.amplifyapp.com
  • 筆者已經從第三方DNS服務商2構買了主網域：off-record.net，這個主網域之下可附帶任何自訂之子網域：子網域名.off-record.net
  • 讓託管於Amplify的網頁使用自訂的子網域，假設為base.off-record.net

生成驗證域

  1. 進入Amplify控制台，指定應用程序
  2. 域管理 ⇒ 添加自定義域 ⇒ 域的空白欄位輸入base.off-record.net，點擊查找域
  3. 子域中會自動增加一項https://www.base.off-record.net
  4. 下方Setup redirect from https://base.off-record.net to https://www.base.off-record.net 保持核選，點擊保存。
  5. 系統進入SSL creation - SSL configuration - Domain activation三階段：
  6. SSL configuration藍燈階段：系統出現提示欄，生成臨時驗證用的網域，格式為1234.base.off-record.net. CNAME 1234.acm-validation.aws.

進行驗證

  1. 登入DNS服務商(以筆者為例，使用的是Hover)控制台，主網域頁面中點擊DNS分頁
  2. 點擊ADD A RECORD ⇒ TYPE: CNAME ⇒ HOSTNAME: 1234.base.off-record.net.，TARGET NAME: 1234.acm-validation.aws.
  3. 回到Amplify控制台，等待一至二分鐘，SSL configuration階段亮起綠燈。

啟用子網域

  1. 再到DNS後台，增加兩個CNAME：
  2. HOSTNAME: base | TARGET NAME: master.12345678.amplifyapp.com
  3. HOSTNAME: www.base | TARGET NAME: master.12345678.amplifyapp.com
  4. 回到Amplify控制台，等待五至十分鐘，Domain activation階段亮起綠燈。

然後就可以拜訪base.off-record.net這個子網域囉！記得回DNS後台將臨時驗證的CNAME RECORD刪除掉(不刪也不會怎樣)。

使用S3存儲桶做為圖床

理論上，建置Hugo部落格時，文章內容附帶的圖片檔案，可以放置在content資料夾。然而這造成了一些問題：

  • GitHub本身並不適合處理較大的檔案=任何非純文字的檔案。
  • 需要交給Amplify部署的資料夾會變得很肥大，占用不必要的時間和資源。

所以建置Hugo部落格時，另外建置圖床，並使用絕對路徑嵌入圖片是必須的。使用絕對路徑嵌入圖片的優點，是本地端的文章或圖片檔案可以任意移動或重新命名，不影響生成的html網頁。

以個人部落格使用量來說，AWS提供的S3存儲桶價格非常低廉，計價算法是用多少算多少，只要使用量(擷取量/存儲量)每月低於1GB，讀取次數低於每月1000次3，便等於免費。

‍

← View all posts