乐趣区

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

本文首发于:https://y0ngb1n.github.io/a/5…

什么是 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 会监听这个仓库的所有变化。
<p align=”center”> <img src=”https://i.loli.net/2019/01/17…; alt=”travis github repo”></p>
.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 的协议,所以拉取失败了,下面提供两个解决方案:

Adding to SSH Known Hosts – 官方提供的解决方案
手动修改 .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

退出移动版