Hexo 搭建我的博客 #05 利用 Travis CI 幫你自動部署

本文首發於：y0ngb1n.github.io/a/5c7519f9.…

什麼是 Travis CI？

Travis CI 是在軟件開發領域中的一個在線的，分佈式的持續集成服務，用來構建及測試在 GitHub 託管的代碼。這個軟件的代碼同時也是開源的，能夠在 GitHub 上下載到，儘管開發者當前並不推薦在閉源項目中單獨使用它。

它提供了多種編程語言的支持，包括 Ruby、JavaScript、Java、Scala、PHP、Haskell 和 Erlang 在內的多種語言。許多知名的開源項目使用它來在每次提交的時候進行構建測試，好比 Ruby on Rails，Ruby 和 Node.js。

目前 Travis CI 兩個站點，提供不一樣的服務：

版本	主頁	特點
免費版	travis-ci.org/	爲開源項目提供免費服務
收費版	travis-ci.com/	能夠部署 GitHub 私有倉庫

兩個站點只能看到各自的項目，不能通用，按需選用。

準備工做

首先，訪問官方網站 travis-ci.org，點擊右上角的登入按鈕，使用 GitHub 帳戶登入 Travis CI。

Travis 會列出 GitHub 上面你的全部倉庫，以及你所屬於的組織。此時，選擇你須要 Travis 幫你構建的倉庫，打開倉庫旁邊的開關。一旦激活了一個倉庫，Travis 會監聽這個倉庫的全部變化。

.travis.yml

Travis 要求項目的根目錄下面，必須有一個 .travis.yml 文件。這是配置文件，指定了 Travis 的行爲。該文件必須保存在 GitHub 倉庫裏面，一旦代碼倉庫有新的 Commit，Travis 就會去找這個文件，執行裏面的命令。

.travis.yml：

language: node_js             # 指定語言環境
node_js: '8.9.3'              # 指定 NodeJS 版本
cache: npm                    # 指定 npm 緩存方案，會緩存 $HOME/.npm 或 node_modules 文件夾

dist: trusty                  # 指定系統版本，trusty 是指 Ubuntu 14.04 發行版的名稱
sudo: required                # 是否須要 sudo 權限

branches:                     # 指定要構建的分支
 only:                       # only 表示只構建如下分支
 - source

before_install:               # install 階段以前執行
 - npm install -g hexo-cli   # 全局安裝 Hexo 命令行工具

install:                      # 在安裝項目環境階段須要運行的命令，一條一行，相似的還有 before_install
 - npm install               # 安裝 package.json 中的依賴

script:                       # 在構建階段須要運行的命令，一條一行，相似的還有 before_script、after_script
 - hexo clean
 - hexo generate             # Hexo 常規命令，執行清理和生成

after_success:                # script 階段成功時執行，構建失敗不會執行，其餘同上
 - git config --local user.name "travis-ci"
 - git config --local user.email "deploy@travis-ci.org"
 - sed -i'' "s~git@github.com:~https://${GITHUB_REPO_TOKEN}@github.com/~" _config.yml
 - hexo deploy > /dev/null # 經過 Hexo 的 deploy 命令部署博客 複製代碼

更多使用技巧請主動參考「持續集成服務 Travis CI 教程」。

那麼，如今又有一個問題了：咱們的目是自動部署到 GitHub Pages，用的是 hexo deploy 命令，可是 Hexo 又配置使用的是 Git push 來推送的（由 hexo-deployer-git 插件提供技術支持），那麼 Travis CI 怎麼有權限操做個人 GitHub 倉庫呢！

GitHub Access Token

如下內容摘抄「使用 Travis 自動構建 Hexo 到 GitHub」

GitHub 容許你經過設置頁面添加一個「我的訪問令牌（Personal access tokens）」，使用 Assess Token 將有權限經過 https 訪問 GitHub Api 操做本身的倉庫，可見這個就是咱們須要的。

如今咱們來添加一個 token，先進入本身 GitHub 的設置頁面，點擊 Personal access tokens → Generate new token 按鈕，新建一個 token。

在權限設置中，咱們只須要操做倉庫，所以只須要打開倉庫相關的權限就夠了，權限開放應該知足最小原則，能少就少。設置好權限後點擊生成按鈕就會生成完畢並跳到 tokens 列表。

如今就須要把剛生成的 Access Token 的值複製下來，注意，這個頁面一旦刷新過了， token 就不能再顯示了，沒記住的只能從新生成一個了。

嗯，如今 Access Token 也有了，能操做倉庫了，那麼，這個 token 應該放到哪裏呢？

確定不是放到代碼裏。。。

其實在 Travis CI 的項目設置界面就有提供設置環境變量，咱們就應該把 token 放到那裏。

回到咱們 Travis CI 的博客項目設置頁面中，添加一個名爲 GITHUB_REPO_TOKEN 的環境變量儲存咱們的 token，並記得要設置 Display value in build log 爲 OFF，關閉變量的顯示，不然等於公開了 token。

如今在咱們的執行腳本中就能使用 $GITHUB_REPO_TOKEN 訪問 token 的環境變量了~

而後就是如何使用了。在 Hexo 部署前，咱們應該把原來的部署倉庫地址用帶有 Access Token 的地址替換掉，因而在 .travis.yml 的 hexo deploy 命令前增長一條命令：

sed -i'' "s~git@github.com:~https://${GITHUB_REPO_TOKEN}@github.com/~" _config.yml
複製代碼

這樣，在執行時，這條命令就能自動替換到有權限操做的 token 地址了，而且也不會泄露或者影響本地的原始配置文件。

構建失敗：子模塊拉取失敗

本博客的第三方主題使用 git submodule 管理，能夠翻看「Hexo 搭建我的博客 #04 主題的安裝與自定義樣式」

詳細的構建日誌可見 #1，下面提取關鍵信息：

$ git submodule update --init --recursive
Submodule 'themes/skapp' (git@github.com:Mrminfive/hexo-theme-skapp.git) registered for path 'themes/skapp'
Cloning into '/home/travis/build/y0ngb1n/y0ngb1n.github.io/themes/skapp'...
Warning: Permanently added the RSA host key for IP address '192.30.253.113' to the list of known hosts.
Permission denied (publickey).
fatal: Could not read from remote repository.
複製代碼

Travis CI 官方是默認支持 Git Submodules，在拉取倉庫時會默認拉取子模塊的倉庫，能夠手動關閉該特性。

因爲在使用 git submodule 時，添加了 git@github.com 的倉庫地址，使用 SSH 的協議，因此拉取失敗了，下面提供兩個解決方案：

1. Adding to SSH Known Hosts - 官方提供的解決方案
2. 手動修改 .gitmodules 裏配置的倉庫地址，將使用 git 協議的倉庫連接改成 https 協議

我這使用方案 2，修改成https 協議：

[submodule "themes/skapp"]
    path = themes/skapp
    url = https://github.com/Mrminfive/hexo-theme-skapp.git
複製代碼

將修改推送至 GitHub 後，Travis CI 會進行構建，此時可見 #2 成功構建了。

在 README 中查看構建狀態

咱們能夠在 README 中添加 Travis CI 的構建狀態，這樣即可方便地查看項目在 Travis CI 上的構建狀態。—— Embedding Status Images、Shields.io

參考資料

• Travis CI Tutorial - @Travis CI Docs
• 持續集成服務 Travis CI 教程 - @阮一峯
• Travis CI 持續集成 GitHub 我的博客 - @路家豪
• 使用 Travis 自動構建 Hexo 到 GitHub - @zthxxx
• 開箱即用，Hexo 博客的 github+server 自動部署 - @伍醬
• 用 Travis CI 自動部署 Hexo 博客 - @Karl
• 使用 Travis CI 自動部署 Hexo 博客 - @wshunli
• Hexo 趕上 Travis-CI：多是最通俗易懂的自動發佈博客圖文教程 - @MichaelX
• Hexo+Github+Travis-ci 搭建程序員本身的博客 - @baiyangliu