寫在前面，搬遷記錄
記錄我的博客這次搬家過程。我的博客之前經歷過：
- wordpress
- github page
- Bitcron - 機制很不錯（寫完的博客自動保存到dropbox併發布，可惜搜索引擎的收錄不是很好。）
- 這次搬遷 2020年4月10日 初步完成
博客的架構
現在寫博客一直採用 markdown 語法，所以也是本次可以順利遷移的一大前提。 最近兩年一直用的是 Bitcron ，非常順滑。每次寫完 md 文件，直接保存即可（博客立即更新可見）。不過一直搜索引擎的收錄不是很好，如我直接搜索 "Bob Jiang" 我的博客始終排不到第一個。很奇怪......
索性現在申請了一年免費的 google cloud，就做個搬遷。
搬遷之後的博客存儲在 google cloud storage 上，DNS也順便切換到 Cloudfare 上了。 博客系統使用的是 hugo ，主題用的是 Ezhil。博客整體存放於 github上，每次提交到github會自動出發一次 github action，推送到谷歌存儲。
博客的工作流
博客的工作機制如下：
- 本次編寫博客(md文件) 並本次檢查 (
hugo server) - github push 到 github 倉庫
- 每次 push 或者 pull request 會出發 github action
- github action 進行 hugo 編譯
- github action 推送博客靜態文件到 谷歌存儲
博客的配置 (手把手教你配置)
第一步，配置hugo
安裝 hugo 可以參考我朋友的博客，免費搭建一個靜態博客。搭建完成後，關於主題，這裏我採用的 hugo 主題是 Ezhil，可以直接用 github fork一份 hugo 主題。具體操作參考 Ezhil。
hugo和主題都準備好後，目錄結構如下：
- content/ 博客的源文件，markdown格式
- public/ 博客的靜態網頁，hugo自動生成（根據你選擇的模板生成漂亮的靜態網頁）
- static/ 博客的全局靜態資源，如全局使用的圖片
- theme/ 博客的主題
- config.toml 博客的配置文件
第二步，新建github倉庫
github上需要創建一個新的倉庫 （假設你已經有了github賬號）。然後把本地的博客目錄中，除了 public/ 目錄的內容推送到代碼倉庫中。
- 訪問 github，登錄（註冊）賬號
- 新建一個倉庫，如下圖，點擊
New Repository
- 填寫倉庫的名字，選擇倉庫的可見性（默認公開的、可以選擇私有的），勾選初始化時創建
README文件，如下圖：
下一步需要創建並配置 谷歌存儲 - Google Cloud Storage，然後再回來配置 github secrets
第三步，google cloud storage
這裏我用的谷歌存儲，也可以選擇國內的阿里雲，騰訊雲的OSS服務。
谷歌存儲 - Google Cloud Storage，需要創建一個存儲。 訪問 Console 如下圖
3.1 創建存儲（bucket）
創建存儲，注意：名字必-須是 www.yourdomain.com 不能設置爲根域名（即這裏需要是 CNAME 的名字設置bucket名字）。 根域名可以通過 DNS 的設置來實現。
注意存儲分區（bucket）名字必須是 CNAME 域名的名字（必須是完全一致），如我的分區名字是 www.bobjiang.com。存儲分區不支持直接改名，可以先創建新名字的存儲分區，然後把數據轉移過去來實現。
訪問權限，可以修改爲"統一"方式，這樣可以簡單操作。
3.2 增加訪問權限
下面是爲新建的存儲分區（bucket）增加訪問權限，點擊"修改存儲分區權限"
點擊"添加成員"
輸入 新成員：allUsers， 角色：Storage Object Viewer （要嚴格檢查這裏的角色權限）
最後可以檢查一下權限的設置，這裏應該提示如下："在互聯網上公開"
3.3 權限設置
這裏主要設置 服務賬號 （service account），爲了給其他的第三方進行服務（如接下來我們用 github action 連接）授權。
- 進入服務賬號頁面，選擇"IAM和管理"，點擊"服務賬號"，如圖
- 點擊"創建服務賬號"
- 輸入"服務賬號名稱"，"服務賬號ID"，和"服務賬號說明"
- 第二步默認值即可，進入第三步如下圖，點擊"創建密鑰"
- 選擇密鑰類型 JSON
- 密鑰生成後，保存到本地（一定保存好密鑰，不要丟失）。使用這個密鑰和服務賬號，就可以訪問你的谷歌雲存儲。
- 記住服務賬號的郵箱，如下圖：
下一步配置 github secrets
第四步，github secrets
如圖創建如下的兩個 github secrets：
- GCP_SA_EMAIL - 值可以參考 服務賬號的創建小節
- GCP_SA_KEY - 值爲下面命令的結果（用本地的 JSON 密鑰生成，命令如下）
cat your-json-key.json | base64
第五步，github action
Github action的作用是：
- 有代碼push 或者pull request到倉庫時，自動出發下列動作
- 準備一個 ubuntu 編譯環境
- 準備 hugo 環境
- 進行 hugo 編譯
- 編譯後的 public 目錄 （靜態網頁） 上傳到 谷歌存儲 - Google Cloud Storage
新建 github action ，並點擊 "set up workflow yourself"
我的 github action 代碼如下：
# github action的名字，可以隨意改
name: build hugo and deploy to google cloud platform (storage)
# 什麼時候調用 action，這裏是當 master 上有代碼 push 或者 pull request 會觸發 github action
on:
push:
branches: [ master ]
pull_request:
branches: [ master ]
# 環境變量的設置，下面會用到
env:
GCP_SA_EMAIL: ${{ secrets.GCP_SA_EMAIL }}
GCP_SA_KEY: ${{ secrets.GCP_SA_KEY }}
GCP_BUCKET: www.bobjiang.com
# 任務的準備，用 ubuntu最新的環境
jobs:
setup-deploy:
name: Setup and Deploy
runs-on: ubuntu-latest
steps:
# 檢出master分支的代碼 checkout
- name: Checkout
uses: actions/checkout@v2
# 準備hugo環境
# hugo ready & build
- name: Setup Hugo
uses: peaceiris/actions-hugo@v2
with:
hugo-version: '0.62.2'
# extended: true
# hugo 編譯生成靜態網頁 public目錄內的內容
- run: hugo --minify
# deploy to google storage
# 準備 連接到 google 雲
- uses: GoogleCloudPlatform/github-actions/setup-gcloud@master
with:
version: '285.0.0'
project_id: ${{ secrets.GCP_PROJECT_ID }}
service_account_email: ${{ secrets.GCP_SA_EMAIL }}
service_account_key: ${{ secrets.GCP_SA_KEY }}
export_default_credentials: true
# 檢查 google 雲的連接結果
- run: gcloud info
# 用 gsutil 推送 public 目錄內容到谷歌雲存儲
- run: gsutil -m rsync -d -c -r public gs://$GCP_BUCKET
- run: gsutil -m setmeta -h "Cache-Control:public, max-age=3600" gs://$GCP_BUCKET/**/*.html
- run: gsutil -m setmeta -h "Cache-Control:public, max-age=31536000" gs://$GCP_BUCKET/js/*.js
- run: gsutil -m setmeta -h "Cache-Control:public, max-age=31536000" gs://$GCP_BUCKET/css/*.css
總結
經過本次梳理後，寫博客完全是本地操作且可以本地調試。 寫博客在 hugo 項目的 content 目錄內寫 markdown 文件 調試可以用 hugo server 本地訪問 http://localhost:1313/
效果滿意後，可以把 content 目錄內的改動 推送到 github 倉庫 後面就是自動化準備環境編譯、部署（github action）到谷歌雲存儲。
所以作爲一個業餘寫手，需要更加關注的是內容產出。
自動化啦......
本文由博客羣發一文多發等運營工具平臺 OpenWrite 發佈