Aben Blog

什麼是 Travis CI？#

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

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

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

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

準備工作#

首先，訪問官方網站 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 "[email protected]"
  - sed -i'' "[email protected]:~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'' "[email protected]:~https://${GITHUB_REPO_TOKEN}@github.com/~" _config.yml

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

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

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

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

$ git submodule update --init --recursive
Submodule 'themes/skapp' ([email protected]: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 時，添加了 [email protected] 的倉庫地址，使用 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