该文写给爱折腾的人,对纯新手不友善,没有辣么详细地说明如何安装node、git或者是hexo,所以关于这些问题可先行google,如有其它问题请在这里或者我的简书上留言

使用hexo而不使用jekyll在github上搭blog最大的问题就是,每次提交都需要先hexo g,然后再push生成的文件们,这样哪怕是改一个小的地方都需要重新编译全部blog,想想都蛋疼(虽然我还没有多少文章),所以决定使用Travis来自动持续集成提交到github以后的操作

网上一搜有很多的教程,看了好多然后东拼西凑才最终成功,遂决定记录下来最终成功的这个方法,以免忘记

本文中实现的最终效果是:

  • 写完blog后,直接push到github的source分支,其它的就可以不用管了

  • 由于我的.travis.yml配置文件里设置监听的就是source分支,所以会触发webhook

  • Travis则会将该项目clone过去,然后按照.travis.yml的设置执行接下来的命令

  • 执行完成后,再将编译好的文件们发送到自己的服务器,顺便pushmaster分支上来

  • 这样就可以在blog.godi13.com和Godi13.github.io上都访问blog了

Github

首先,按规定名称XXXXX.github.io,其中XXXXX为你的用户名,如下图中的Godi13.github.io创建项目

为了使travis能够将编译好的文件们push回咱们的github,我们需要生成token,步骤如下:

1) 点击右上方头像,然后点setting

2) 点击Personal access tokens

3) 点击Generate new token

4) 为token起一个名字,勾选repo,然后点击生成

<div class="tip">生成token以后,一定要复制好,因为只显示一次,如果丢失只能再次生成了</div>

Travis

1) 使用github帐号登录Travis,右上方按钮点击同步项目,下方打开需要集成的项目,最后点击齿轮进入项目配置页面

2) 打开Build only if .travis.yml is present,右下角的那个其实也可以关了,然后往下移动页面到环境变量

3) 在这里我将变量名称名为REPO_TOKEN,放上token,点击Add按钮

Terminal

回到终端,进入blog所在的文件夹下,新建.travis.yml文件,并添加以下内容

# 使用语言
language: node_js
# node版本
node_js: stable
# 设置只监听哪个分支
branches:only:- source
# 缓存,可以节省集成的时间,这里我用了yarn,如果不用可以删除
cache:apt: trueyarn: truedirectories:- node_modules
# tarvis生命周期执行顺序详见官网文档
before_install:
- git config --global user.name "Godi13"
- git config --global user.email "mqzq9388@gmail.com"
# 由于使用了yarn,所以需要下载,如不用yarn这两行可以删除
- curl -o- -L https://yarnpkg.com/install.sh | bash
- export PATH=$HOME/.yarn/bin:$PATH
- npm install -g hexo-cli
install:
# 不用yarn的话这里改成 npm i 即可
- yarn
script:
- hexo clean
- hexo generate
after_success:
- cd ./public
- git init
- git add --all .
- git commit -m "Travis CI Auto Builder"
# 这里的 REPO_TOKEN 即之前在 travis 项目的环境变量里添加的
- git push --quiet --force https://$REPO_TOKEN@github.com/Godi13/Godi13.github.io.gitmaster

然后,准备push该项目到github,看下是否成功,如果是新项目可参照下面的git指令

git init
# 添加自己的项目
git remote add origin git@github.com:Godi13/Godi13.github.io.git
# 新建并切换分支
git checkout --orphan source
git add -A
git commit -m "Travis CI"
git push

关于 --orphan 请参考 如何建立一個沒有 Parent 的獨立 Git branch

如最终成功则会看到

到这里关于hexo和github的事情就先吿一段落,接下来就是服务器与tarvis

服务器

按照上面.tarvis.yml的设置,其实我只需要在after_success这个生命周期中,把public文件夹下的所有文件传送到服务器指定的路径即可,接下来就是解决如何让tarvis往我的服务器传东西的问题了

在此之前,你需要将本机生成的密钥传到服务器上

ssh-keygen -t rsa # 然后一路回车即可
# ssh-copy-id 可能需要另行安装
# 如果ssh默认端口是22,则不需要 -p
ssh-copy-id <登录部署服务器用户名>@<部署服务器地址> -p <部署服务器ssh端口>
ssh <登录部署服务器用户名>@<部署服务器地址> -p <部署服务器ssh端口>

如果登录服务器成功,接下来需要安装travis命令行工具

# 安装travis命令行工具,如无法使用gem指令须先安装ruby
gem install travis
# --auto自动登录github帐号
travis login --auto
# 此处的--add参数表示自动添加脚本到.travis.yml文件中
travis encrypt-file ~/.ssh/id_rsa --add
# 这个命令会自动把 id_rsa 加密传送到 .git 指定的仓库对应的 travis 中去

执行完以后会发现在travis网站项目里面的环境变量里多了两个参数

并且在.travis.yml里的before_install周期中多了下面这2行

- openssl aes-256-cbc -K $encrypted_97d432d3ed20_key -iv $encrypted_97d432d3ed20_iv-in id_rsa.enc -out ~\/.ssh/id_rsa -d

默认生成的命令可能会在/前面带转义符\,我们不需要这些转义符,手动删掉所有的转义符,否则可能在后面引发莫名的错误

之后为了保证命令的顺利运行,我们还需要正确地设置权限和认证

before_install
- openssl aes-256-cbc -K $encrypted_97d432d3ed20_key -iv $encrypted_97d432d3ed20_iv-in id_rsa.enc -out ~/.ssh/id_rsa -d
- chmod 600 ~/.ssh/id_rsa
- echo -e "Host 主机IP地址\n\tStrictHostKeyChecking no\n" >> ~/.ssh/config

最后,就是在after_success周期中,添加上传服务器的指令即可,在这里要注意,如果没有stricthostkeychecking=no参数,将构建失败,详细原因请参考通过travis部署代码到远程服务器

# 由于我修改了默认的port,所以在这里也进行了加密处理
- scp -o stricthostkeychecking=no -P $PORT -r public/* 用户@域名:/路径

但使用scp有很多问题,所以后来我决定改用rsync命令,缺点是端口号就不能用travis环境来加密了,如果哪个朋友有更好的方案希望能告诉我

# public 后面加上/即可将该目录下的文件都传送到服务器了
- rsync -rv --delete -e 'ssh -o stricthostkeychecking=no -p 端口号' public/ 用户@域名:/路径

最后在这里放上我最终的.travis.yml配置参数,希望本文对大家能有所帮助,如果觉得不错记得点赞~ 如果能告诉我为什么觉得我写的还不错就更好了,我就知道该怎么再接再厉了,谢谢大家的支持~~~~

参考资料

  • Hexo作者的.travis.yml配置

  • 用 Travis CI 自動部署網站到 GitHub

  • 一点都不高大上,手把手教你使用Travis CI实现持续部署

  • 使用 Travis CI 自动更新 GitHub Pages

  • 使用Travis CI自动构建hexo博客

使用 Travis 自动部署 Hexo 到 Github 与 自己的服务器相关推荐

  1. 使用Travis CI自动部署Hexo博客

    自从使用GitHub Pages和Hexo来发布博客之后,不得不说方便了许多,只需要几个简单的命令博客就发布了.但在不断的使用中发现每次的发布操作也挺耗时的. 我一般的操作是将平时整理好的md文件放到 ...

  2. 基于Travis CI实现 Hexo 在 Github 和 Coding 的同步部署

      各位朋友,大家好,我是Payne,欢迎大家关注我的博客,我的博客地址是 https://qinyuanpei.github.io .在曾经的一篇博客:<持续集成在Hexo自动化部署上的实践& ...

  3. 用GitHub Actions自动部署Hexo

    本文不算原创,是根据参考文档结合自己的需要修改而成,但也非转载和翻译. 老苏一直用 hexo 发博文,发布过程经历了 三个阶段 第一阶段 : 在家里的台式机上发布 hexo ,流程是先把要发布博文的 ...

  4. 用TravisCI持续集成自动部署Hexo博客的个人实践

    优秀的程序员都是不用持续集成的 前几天我面试了一个码农,连续几个专业问题他都没答上来. 尴尬之余,我问它:「你没有什么理想吗?你现在最渴望的事情是什么?」 码农转悠着大眼睛,不假思索道:「做一个持续集 ...

  5. 项目添加到服务器报错,基于github+travis自动部署vue项目到远端服务器

    前期准备 github账号一个 一个vue的项目 一台linux服务器 travis中添加项目 travis是基于github的,所有只有github的账号可以登录travis,开发者必须有一个git ...

  6. yuque-hexo:语雀写文,自动部署 Hexo 博客

    熟悉我的小伙伴应该知道,我喜欢使用 Markdown 来工作.学习笔记,主要是简洁方便. 并且我是一个坚定地"原生 Markdown 支持者",什么"所见即所得" ...

  7. 部署hexo博客到阿里云服务器

    一:域名购买.服务器ECS购买 购买域名,服务器ECS,并将域名解析到服务器的公网ip 通常域名的实名认证需要花一段时间,建议提早准备好. 二:本地博客搭建 首先建立一个博客,本地能访问就行 三:云服 ...

  8. Vue项目自动部署【精简版】NuxtJS + GitHub Actions + Linux 自动部署学习(包含阿里云Linux ECS购买过程、传统部署流程、pm2、Github Actions)

    购买阿里云Linux服务器 如果已有服务器请直接跳转到[传统部署方式] 登录阿里云,访问 云服务器 ECS 购买地址:https://ecs-buy.aliyun.com/ 也可从首页导航菜单进入. ...

  9. 搭建gitserver并实现git push 自动部署

    git push自动部署能大大提交开发部署效率 git 自动部署分为2类, git server和部署不在同一个服务器上(比如通过github部署) git server和要部署的目录在同一个服务器上 ...

  10. 使用 Hexo 创建 GitHub Page 博客(一)

    CSDN GitHub Hexo 使用 Hexo 创建 GitHub Page 博客(一) AderXCoding/blob/master/system/tools/hexo/01-use_hexo ...

最新文章

  1. 求助:一个物理专业的在做GPU的人
  2. 如果有两个很大的数加在一起
  3. python接口测试覆盖率统计_从 jacoco 报告数据分析,python 脚本实现增量覆盖率统计...
  4. DSG-Oracle数据库在线迁移服务
  5. SSH原理与运用(一):远程登录
  6. Java开发环境之RabbitMQ
  7. [vue] 你了解axios的原理吗?有看过它的源码吗?
  8. 剑指offer——7.重建二叉树
  9. ubuntu安装docker以及dockerfly
  10. OSChina 周二乱弹 ——流川枫与苍井空
  11. 修改Eclipse配色方案
  12. 36氪独家|「秦汉胡同」完成1亿元A轮融资,将发力线上内容产品和女性生活学习服务社群...
  13. centos7加载磁盘
  14. WinDbg非常简单的调试dmp文件
  15. MySQL数据库_(学生_教师_课程_成绩)表_练习
  16. 很好用的数据库数据字典【可导出为word , excel文件】
  17. 轻松掌握辗转相除法(原理+俩道简单编程题详解)
  18. 目标人脸检测与识别(计算机视觉)
  19. Charles(青花瓷)抓包教程
  20. jeesite框架分析理解

热门文章

  1. 描述cookie,sessionstroage,localstrage的区别
  2. java.lang.IllegalArgumentException: name MUST NOT NULL! at org.nutz.dao.impl.NutDao.fetch
  3. 代码分析系列 数3退1
  4. NHibernate初探(五) 多对多关系测试示例
  5. 兼容IE8以下,获取className节点的元素(document.getElementsByClassName()兼容写法)。
  6. android非法字符的判定、表情符号的判定
  7. 为Node.js编写组件的几种方式
  8. 推荐使用MEF降低耦合(2)
  9. 11.13 什么是媒体?什么是媒体引用?媒体引用的本地同步?
  10. Spring Boot 集成Shiro和CAS