Hexo 搭建个人博客 #05 利用 Travis CI 帮你自动部署

Travis CI

本文首发于：https://y0ngb1n.github.io/a/5c7519f9.html

什么是 Travis CI？

Travis CI 是在软件开发领域中的一个在线的，分布式的持续集成服务，用来构建及测试在 GitHub 托管的代码。这个软件的代码同时也是开源的，可以在 GitHub 上下载到，尽管开发者当前并不推荐在闭源项目中单独使用它。

它提供了多种编程语言的支持，包括 Ruby、JavaScript、Java、Scala、PHP、Haskell 和 Erlang 在内的多种语言。许多知名的开源项目使用它来在每次提交的时候进行构建测试，比如 Ruby on Rails，Ruby 和 Node.js。

目前 Travis CI 两个站点，提供不同的服务：

版本	主页	特色
免费版	https://travis-ci.org/	为开源项目提供免费服务
收费版	https://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 "[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。

Generate new token

在权限设置中，我们只需要操作仓库，因此只需要打开仓库相关的权限就够了，权限开放应该满足最小原则，能少就少。设置好权限后点击生成按钮就会生成完毕并跳到 tokens 列表。

Personal access tokens

现在就需要把刚生成的 Access Token 的值复制下来，注意，这个页面一旦刷新过了， token 就不能再显示了，没记住的只能重新生成一个了。

Copy personal access tokens

嗯，现在 Access Token 也有了，能操作仓库了，那么，这个 token 应该放到哪里呢？

肯定不是放到代码里。。。

其实在 Travis CI 的项目设置界面就有提供设置环境变量，我们就应该把 token 放到那里。

回到我们 Travis CI 的博客项目设置页面中，添加一个名为 GITHUB_REPO_TOKEN 的环境变量储存我们的 token，并记得要设置 Display value in build log 为 OFF，关闭变量的显示，否则等于公开了 token。

添加 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 主题的安装与自定义样式」

Build History

详细的构建日志可见 #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

README

参考资料

• 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