前言

前面两篇文章介绍了在github上使用hexo搭建博客的基本环境和hexo相关参数设置等。

基于目前,博客基本上是可以完美运行了。

但是,有一点是不太好,就是源码同步问题,如果在不同的电脑上写文章会非常不方便。

是因为hexo使用的部署命令是把生成好的静态文件上传到仓库中的,所以,在其他电脑上同步下来的只是静态文件而已,不是源码。

到这里就会想到能不能这样:将源码同步到远程仓库后,可以实现自动生成部署呢?

答案是肯定的,可以通过Travis CI来实现。

那么,本文就介绍一下Travis CI实现Hexo博客自动生成并部署。

说明:

文中出现的命令,Windows用户注意,命令前面有 $ 的表示在Git Bash中执行,没有的在CMD命令窗口执行。

Linux和MAC系统在终端下不区分。

配置多个SSH

  • 生成ssh密钥

    可以使用全局的ssh密钥,不过建议使用单独的ssh密钥,在这里以单独ssh密钥为例。

    由于之前生成过ssh密钥,现在不能覆盖之前的,只需要在执行生成命令时注意一下就好了。
$ #切换到.ssh文件下
$ cd ~/.ssh
$ #生成密钥,后面换成自己的github邮箱
$ ssh-keygen -t rsa -C "SeayXu@163.com"

输入上面命令后回车一下,当提示Enter file in which to save the key (/c/Users/Seay/.ssh/id_rsa):时,输入新的ssh密钥文件路径和文件名(不能是.ssh/id_rsa),这里输入id_rsa_blog,然后一路回车。



密钥已经成功生成。

  • 添加ssh到github

    登录到github中,点击进入到博客仓库。

    点击右上方的Settings进入到设置页面,点击左边的Deploy keys项。

    在右上点击Add deploy key,然后在下面输入标题,把生成的密钥id_rsa_blog.pub里面的内容复制到key文本框中,选中下面的Allow write access,最后点击Add key

  • 新建配置文件

    在.ssh文件夹中创建一个名为config的配置文件。

$ cd ~/.ssh
$ touch config
  • 编辑配置信息

    用编辑器打开config文件,添加如下信息:
# github
Host github.com
HostName github.com
PreferredAuthentications publickey
IdentityFile ~/.ssh/id_rsa
# 这里是空行
# github_blog
Host github.com
HostName github.com
PreferredAuthentications publickey
IdentityFile ~/.ssh/id_rsa_blog

提示:这里的密钥文件路径根据自己的做相应修改。

配置Travis

  • 接入Travis CI

    打开Travis CI网站,使用github账号登录。

    将鼠标放在右上角的用户名上,点击Account选项,会显示github的项目。

    找到博客项目,点击前面带有 X 符号的按钮,开启travis支持。



    然后点击设置按钮,在项目的设置中开启Build only if .travis.yml is present这一项.

  • 安装travis

    Travis安装需要Ruby环境,所有需要安装Ruby,并且需要安装rubygems插件。

# 安装travis
gem isntall travis
  • 新建配置文件

    首先打开博客项目文件夹,在项目根目录新建.travis.yml配置文件。
$ cd 博客项目文件夹根目录
$ touch .travis.yml
  • 复制ssh私钥

    在项目根目录创建文件夹.travis
$ mkdir .travis

将开始生成的ssh密钥文件id_rsa_bolg复制到.travis文件夹下:

$ cp ~/.ssh/id_rsa_blog .travis/
  • ssh配置文件

    这个ssh配置文件是用于在部署机器上使用的,不是本地的ssh配置文件,后面的travis配置文件会用到。

    在.travis文件夹中新建文件ssh_config
$ touch .travis/ssh_config

编辑配置文件,添加如下内容:

Host github.com
User git
StrictHostKeyChecking no
IdentityFile ~/.ssh/id_rsa
IdentitiesOnly yes
  • 登录travis
travis login --auto

然后会提示输入github的用户名和密码。

  • 加密操作

    在博客项目文件夹下对ssh的私钥进行加密
travis encrypt-file .travis/id_rsa_blog .travis/ --add

此操作会生成加密之后的秘钥文件 id_rsa_blog.enc,删除id_rsa_blog密钥文件(私钥不能随便泄露)。

同时在终端上会输出类似如下信息:

openssl aes-256-cbc -K $encrypted_xxxxxxxxxxx_key -iv $encrypted_xxxxxxxxxxx_iv

这是用于id_rsa_blog.enc解密的信息,保存上面 xxxxxxxxxxx的信息,后面会在.travis.yml配置文件会用到。

编辑配置文件

Travis配置文件

打开Travis配置文件.travis.yml,添加如下信息:

language: node_js
node_js:
- "4" # nodejs的版本
branches:
only:
- dev # 设置自动化部署的分支
before_install:
- export TZ='Asia/Shanghai' # 设置时区
- npm install -g hexo
- npm install -g hexo-cli
# 将xxxxxxxxxxx替换上面生成的内容
# 这里面的文件路径可根据自己的情况进行修改
# 解密id_rsa_blog.enc 输出到.ssh/文件夹下,命名为id_rsa
- openssl aes-256-cbc -K $encrypted_xxxxxxxxxxx_key -iv $encrypted_xxxxxxxxxxx_iv -in .travis/id_rsa_blog.enc -out ~/.ssh/id_rsa -d
# 设置id_rsa文件权限
- chmod 600 ~/.ssh/id_rsa
# 添加ssh密钥
- eval $(ssh-agent)
- ssh-add ~/.ssh/id_rsa
# 添加ssh配置文件
- cp .travis/ssh_config ~/.ssh/config
# 设置github账户信息
- git config --global user.name "SeayXu" #设置github用户名
- git config --global user.email SeayXu@163.com #设置github用户邮箱
# 安装依赖组件
install:
- npm install
# 执行的命令
script:
- hexo clean && hexo g -d

编辑Hexo配置

如果之前配置过deploy信息可以略过.

deploy:
type: git
repo: git@github.com:seayxu/seayxu.github.io.git # 同步的仓库
branch: dev # 同步的分组,与travis中的分支相同

本地操作

  • 初始化本地仓库

    切换到项目根目录下,删除原来部署时产生的.git文件夹.

    执行初始化操作
$ git init

关联远程仓库

$ # 将github仓库改为自己的
$ git remote add origin git@github.com:SeayXu/seayxu.github.io.git
  • 推送仓库

    提交本地修改,推送至github仓库。
$ # 添加文件
$ git add .
$ # 提交修改
$ git commit -m "test travis"
$ # 推送至远程仓库
$ git push -u origin dev

push本地的代码至远程仓库之后,在https://travis-ci.org后台查看相关情况。

下面是成功的结果:

经验提示

1.Windows用户可能会出现如下错误:

The command "openssl aes-256-cbc -K $encrypted_xxxxxxxxxxx_key -iv $encrypted_xxxxxxxxxxx_iv -in .travis/id_rsa_blog_travis.enc -out ~/.ssh/id_rsa -d" failed and exited with 1 during .

这个错误在github中有issues,可以去看一下,我回答了部分。

我的原因是travis在执行加密操作生成的加密信息位数不对。之后在ubuntu系统中操作就一切正常。

如果不想安装虚拟机,还有另外一种方式实现,在下一篇文章中会详细说明。

2.所有的配置文件是yaml格式,空格一定要注意。



【Hexo博客交流群】

群号:582271078

原文:手把手教从零开始在GitHub上使用Hexo搭建博客教程(三)-使用Travis自动部署Hexo(1)

手把手教从零开始在GitHub上使用Hexo搭建博客教程(三)-使用Travis自动部署Hexo(1)的更多相关文章

  1. 手把手教从零开始在GitHub上使用Hexo搭建博客教程(四)-使用Travis自动部署Hexo(2)

    前言 前面一篇文章介绍了Travis自动部署Hexo的常规使用教程,也是个人比较推荐的方法. 前文最后也提到了在Windows系统中可能会有一些小问题,为了在Windows系统中也可以实现使用Trav ...

  2. 手把手教从零开始在GitHub上使用Hexo搭建博客教程(二)-Hexo参数设置

    前言 前文手把手教从零开始在GitHub上使用Hexo搭建博客教程(一)-附GitHub注册及配置介绍了github注册.git相关设置以及hexo基本操作. 本文主要介绍一下hexo的常用参数设置. ...

  3. 手把手教从零开始在GitHub上使用Hexo搭建博客教程(一)-附GitHub注册及配置

    前言 有朋友问了我关于博客系统搭建相关的问题,由于是做开发相关的工作,我给他推荐的是使用github的gh-pages服务搭建个人博客. 推荐理由: 免费:github提供gh-pages服务是免费的 ...

  4. hexo搭建博客系列(三)美化主题

    文章目录 其他搭建 1. 添加博客图标 2. 鼠标点击特效(二选一) 2.1 红心特效 2.2 爆炸烟花 3. 设置头像 4. 侧边栏社交小图标设置 5. 文章末尾的标签图标修改 6. 访问量统计 7 ...

  5. Hexo搭建博客教程(1) - 安装环境与本地搭建

    前言 搭建个人博客一般有两种选择,一个是使用WordPress,但是需要将博客搭建在服务器上,不过搭建好后写文章方便,适合没有程序基础的人使用.另一个是使用Hexo,相对简洁高效,不需要服务器,既可以 ...

  6. Hexo搭建博客教程(3) - 远程部署到GitHub Pages

    本章讲的是如何将本地的个人项目远程部署到 GitHub Pages,涉及到GitHub的项目仓库.Git的使用,以及Hexo的远程部署等. 1. 安装 hexo-deployer-git 插件 想要将 ...

  7. Hexo搭建博客教程(2) - 博客的简单个性化配置

    本章主要讲博客的个性化,譬如站点的基本配置(语言.头像.站点图标等).安装新的Hexo主题(NexT主题)以及主题的配置. 1. 修改站点配置 打开站点配置文件 ,找到: # Site title: ...

  8. 使用github+hexo搭建博客笔记

    听说github上可以搭博客,而且不用自己提供空间和维护,哈哈哈 作为一名程序猿,github搭博客对我有种神奇的吸引力,赶紧动手试一试 关于如何使用hexo搭建博客网上好的教程多如牛毛,而且这篇博客 ...

  9. 基于Hexo搭建博客并部署到Github Pages

    基于Hexo搭建博客并部署到Github Pages 之前在简书上写东西,觉得自己还是太浮躁.本来打算用Flask自己写一个,以为是微框架就比较简单,naive.HTML.CSS.JS等都要学啊,我几 ...

随机推荐

  1. C++随笔:从Hello World 探秘CoreCLR的内部(1)

    紧接着上次的问题,上次的问题其实很简单,就是HelloWorld.exe运行失败,而本文的目的,就是成功调试HelloWorld这个控制台应用程序. 通过我的寻找,其实是一个名为TryRun的文件出了 ...

  2. FFmpeg + SoundTouch实现音频的变调变速

    本文使用FFmpeg + SoundTouch实现将音频解码后,进行变调变速处理,并将处理后的结果保存为WAV文件. 主要有以下内容: 实现一个FFmpeg的工具类,保存多媒体文件所需的解码信息 将解 ...

  3. [笔记]HAproxy reload config file with uninterrupt session

    HAProxy is a high performance load balancer. It is very light-weight, and free, making it a great op ...

  4. C++ 事件驱动型银行排队模拟

    最近重拾之前半途而废的C++,恰好看到了<C++ 实现银行排队服务模拟>,但是没有实验楼的会员,看不到具体的实现,正好用来作为练习. 模拟的是银行的排队叫号系统,所有顾客以先来后到的顺序在 ...

  5. 微信小程序初探

    做为码农相信大家最近肯定都会听到微信小程序,虽然现阶段还没有正式开放注册,但大家可以还是可以开发测试. 到微信的WIKI(http://mp.weixin.qq.com/wiki?t=resource ...

  6. Android中的沉浸式状态栏效果

    无意间了解到沉浸式状态栏,感觉贼拉的高大上,于是就是试着去了解一下,就有了这篇文章.下面就来了解一下啥叫沉浸式状态栏.传统的手机状态栏是呈现出黑色条状的,有的和手机主界面有很明显的区别.这一样就在一定 ...

  7. 《MySQL必知必会》学习笔记

    数据库:数据库是一种以某种有组织的方式存储的数据集合.其本质就是一个容器,通常是一个或者一组文件. 表:表示一种结构化的文件,可用来存储某种特定类型的数据. 模式:描述数据库中特定的表以及整个数据库和 ...

  8. PowerShell 数组以及XML操作

    PowerShell基础 PowerShell数组操作 将字符串拆分成数据的操作 cls #原始字符串 $str = "abc,def,ghi,mon" #数据定义 #$StrAr ...

  9. Markdown学习笔记

    分为两步: 1.阅读Markdown中文官网的文档 2.下载MarkdownPad2将中文官网中文档的例子敲一遍,其中Markdownpad2为官网中推荐的编辑器 备注: 如果只看中文官网文档,不边看 ...

  10. Enterprise Integration Pattern - 组成简介

    近些年来,越来越多的Web应用正在逐渐向大型化的方向发展.它们通常都会包含一系列相互协作的子服务.在开发过程中,如何让这些子服务协同工作常常是软件开发人员所最为头疼的问题,如各个子服务之间的数据表示不 ...