建站06-双线部署 + 自动部署教程

一、镜像备份

Gitee导入Github仓库并同步更新-theONLY-CSDN博客

仓库镜像管理 Gitee↔Github双向同步

二、自动部署

自动部署即持续集成，通过一次配置部署方案，省去每次修改源码后手动 deploy 的时间。

传统的 hexo 博客更新过程是：在完成写作之后，利用命令行调用 hexo g && hexo d 来生成静态博客文件以及并推送到远端的仓库中。这种方法会产生三个痛点：

1. 每一次修改源文件后都需要重新生成一边静态文件，当大量修改时，步骤就变得繁琐且无趣。
2. 生成静态文件依赖电脑中的 hexo 和 node.js 环境，不方便在外出时临时写或修改博客。
3. 博客源文件没有自动的备份功能，不符合安全原则。

配置 GitHub Action、Travis CI、Vercel 等持续集成工具能解决以上痛点。

注意源码存放位置有两种方案：

1. 把源码放在私库里，生成网页文件在公库上。
2. 使用一个公库，两个分支（生成网页文件分支，即默认分支 master；源码文件分支 hexo）。

情况不同，具体配置细节不同。

源码仓库在 coding 上，参考 Hexo+coding实现自动化部署。

---

2023年5月21日 目前语雀部署方案已搁置，换用 Obsidian 方案。

---

A. 语雀部署

Github Action+ 语雀

Github Action，完全免费的 GitHub 持续集成工具。

语雀 是在线知识协作平台，可以创建文档、图片等资源项目，这里把它用作富文本显示的 md 编辑器，使用体验比目前主流 md 编辑器更美观，并且有 插件(yuque-hexo) 支持修改语雀文章即自动同步更新到网站。

语雀同步配置以及 Github Action 整体配置的手把手详细步骤参考：

⭐hexo×语雀 实现云端富文本写作 - 小冰博客；Hexo：语雀云端写作 Github Actions 持续集成 | HONGWEI（CSDN地址）；yuque-hexo：语雀写文，自动部署 Hexo 博客 - CSDN。

语雀上的 front-matter 模板格式与行文格式参考 Hexo 博客终极玩法：云端写作，自动部署（②思否地址③JavaShuo地址）；语雀专用测试文章。

网站源文件配置云函数配置

①安装 yuque-hexo 插件（npm i --save-dev yuque-hexo）

②修改根目录下的 package.json：

"scripts": {
  "build": "hexo generate",
  "clean": "hexo clean",
  "deploy": "hexo deploy",
  "server": "hexo server",
  "sync": "yuque-hexo sync",
  "clean:yuque": "yuque-hexo clean",
  "reset": "npm run clean:yuque && npm run sync"
},
"yuqueConfig": {
  "postPath": "source/_posts/a",
  "mdNameFormat": "title",
  "adapter": "markdown",
  "lastGeneratePath": "./yuque-lastgeneratetimestamp.txt",
  "concurrency": 2,
  "baseUrl": "https://www.yuque.com/api/v2",
  "login": "****",
  "repo": "****",
  "token": "*****",
  "onlyPublished": false,
  "onlyPublic": true
},

login 填语雀设置的用户个人路径字符，repo 填语雀知识库的路径字符，token 填语雀设置的 Token 字符，其他参数可参考 官方解释 自定义配置。

③备份好 _post 文件夹后，本地终端运行 yuque-hexo sync 下载语雀文章，运行 yuque-hexo clean 清除语雀文章，运行 hexo g & hexo s 本地调试效果。

④新建 \.github\workflows\autodeploy.yml：

name: 自动部署
 
# 当有改动推送和语雀发布时，启动Action
on: [push, repository_dispatch]
 
jobs:
  deploy:
    runs-on: windows-latest #运行环境
    steps:
      - name: 检查分支
        uses: actions/checkout@v2.3.1 #小步骤使用的别人写好的 actions 库名称或路径
        with:
          ref: hexo
 
      - name: 安装 Node
        uses: actions/setup-node@v1
        with:
          node-version: "12.x"
 
      - name: 安装 Hexo
        run: |
          export TZ='Asia/Shanghai'
          npm install hexo-cli -g
        #npm install gulp-cli -g如果你有使用gulp的话，打开这一行
          npm install yuque-hexo -g
          yuque-hexo clean
          yuque-hexo sync
 
      - name: 更新 语雀拉取缓存及文章 #更新yuque 拉取的文章到GitHub仓库
        run: |
          echo `date +"%Y-%m-%d %H:%M:%S"` begin > time.log
          git config --global user.email "name@mail.com"
          git config --global user.name "username"
          git add .
          git commit -m "Refresh yuque json" -a
 
      - name: 推送 语雀拉取缓存及文章 #推送修改后的yuque.json
        uses: ad-m/github-push-action@hexo
        with:
          github_token: ${{ secrets.GITHUB_TOKEN }}
 
      - name: 缓存 Hexo
        uses: actions/cache@v1
        id: cache
        with:
          path: node_modules
          key: ${{runner.OS}}-${{hashFiles('**/package-lock.json')}}
 
      - name: 安装依赖
        if: steps.cache.outputs.cache-hit != 'true'
        run: |
          npm install --save
 
      - name: 生成静态文件
        run: |
          hexo clean
          hexo g
        #gulp如果你有使用gulp的话，打开这一行
 
      - name: 部署
        run: |
          git config --global user.name "username"
          git config --global user.email "name@mail.com"
          hexo deploy

将 name@mail.com 和 username 修改成自己的配置即可。

百度智能云或腾讯云登录云函数：

①新建空白函数；自定义函数名称，运行环境选择 python，超时设置 10s；

②百度智能云触发器选择 HTTP 触发器，，URL 路径填 /，HTTP 方法选择 POST 和 GET；腾讯云触发管理新建 API网关触发器，复制配置好后的访问路径。

③进入代码编辑页面，输入以下代码：

# -*- coding: utf8 -*-
import requests
 
def main_handler(event, context):
    r = requests.post("https://api.github.com/repos/usernamme/reponame/dispatches",
    json = {"event_type": "start"},
    headers = {"User-Agent":'curl/7.52.1',
              'Content-Type': 'application/json',
              'Accept': 'application/vnd.github.everest-preview+json',
              'Authorization': 'token *****'})
    if r.status_code == 204:
        return "This's OK!"
    else:
        return r.status_code

将 usernamme、reponame、token ***** 分别改为自己的 GitHub 用户名、源码仓库名与私钥。

Travis CI+ 语雀

关于 Travis CI：

是一个提供持续集成功能的平台，目前有两个站点:

1. Travis.org 对于所有 public 项目完全免费
2. Travics.com 只针对 private 项目，提供一些额外功能，如 cache，并行 build 个数
   两个站点只能看到各自的项目，不能通用。
   可配置 GitHub、coding、gitee 等代码仓库的自动部署。

参考教程Travis CI配置网站源文件配置云函数配置语雀webhook配置

• 配置逻辑：使用Travis CI自动部署Hexo博客 | IT范儿 另一地址：使用Travis CI自动部署Hexo博客 - 酷小孩 - 博客园
• 自定义 commit 内容：①时间 博客折腾记：使用 Travis CI 自动部署博客 | 算法花园②数字，邮件通知 构建指定仓库_使用Travis CI自动构建和部署你的GitBook
• 通配变量名：使用TRAVIS-CI自动部署GITHUB上的项目 - 灰信网；利用Travis CI+GitHub实现持续集成和自动部署 - 知乎
• 设置操作系统：The Travis CI Blog: Windows is Available (Early Release)
• 设置语言版本：“nvs add stable” fails on Windows
• coding 配置与双线域名解析：使用travisCI自动部署hexo博客并使用国内外不同dns-caoayu-CSDN博客

可以在 travis的项目页 的源码仓库点击 Build History-Build job 查看执行记录，也可以通过设置邮件通知直达执行记录，判断是否成功部署。

Travis CI 自动部署配置成功后，可直接推送源码更改至 hexo 分支（自设的源码分支名或源码仓库的默认分支名），然后自动生成网页文件到配置的生成网页仓库地址，不用再 hexo clean+hexo g+hexo d 三连。

更新方法可参考 使用Travis CI自动部署博客到github pages和coding pages - Akkuman - 博客园 的题外话部分。

coding 的配置可参考 博客折腾记：使用 Travis CI 自动部署博客。

Travis CI 网站开启仓库管理，配置仓库设置的环境变量:

1. CO_REF: Coding 生成网页文件仓库地址。格式：github.com/username/username.github.io.git
2. Abcdefghij: Coding 的个人访问令牌处的令牌用户名，每个人不相同。（以前的方法设 Coding_Token 行不通，当前无法自定义令牌名用到 Travis 上）
3. CO_N：coding 的个人账户手机号或邮箱。（最好用手机号，邮箱的 @ 要转义）
4. GH_REF：GitHub 生成网页文件仓库地址。格式：e.coding.net/username/username.git
5. Travis_Token：GitHub 配置的 Travis CI 令牌
6. U_EMAIL：GitHub 注册邮箱
7. U_NAME：GitHub 用户名称
8. YUQUE_TOKEN：语雀用户设置的 token

不论是将源码与生成网页放在两个仓库（后者的情况要对源码仓库进行配置变量），还是同一仓库的两个分支，GH_REF 变量值都是 GitHub 存放生成网页文件的仓库地址。

①安装 yuque-hexo 插件（npm i --save-dev yuque-hexo）

②修改根目录下的 package.json：

"scripts": {
  "build": "hexo generate",
  "clean": "hexo clean",
  "deploy": "hexo deploy",
  "server": "hexo server",
  "sync": "yuque-hexo sync",
  "clean:yuque": "yuque-hexo clean",
  "reset": "npm run clean:yuque && npm run sync"
},
"yuqueConfig": {
  "postPath": "source/_posts/a",
  "mdNameFormat": "title",
  "adapter": "markdown",
  "lastGeneratePath": "./yuque-lastgeneratetimestamp.txt",
  "concurrency": 2,
  "baseUrl": "https://www.yuque.com/api/v2",
  "login": "****",
  "repo": "****",
  "token": "*****",
  "onlyPublished": false,
  "onlyPublic": true
},

login 填语雀设置的用户个人路径字符，repo 填语雀知识库的路径字符，token 填语雀设置的 Token 字符，其他参数可参考 官方解释 自定义配置。

③备份好 _post 文件夹后，本地终端运行 yuque-hexo sync 下载语雀文章，运行 yuque-hexo clean 清除语雀文章，运行 hexo g & hexo s 本地调试效果。

⑤在网站源码根目录下创建 .travis.yml

language: node_js # 设置语言
node_js: node # 设置相应版本
os: windows # 操作系统
cache:
  apt: true
  directories:
    - node_modules # 缓存不经常更改的内容
# 邮件通知成功或是失败
notifications:
  email:
    recipients:
      - name1@mail.com
      - name2@mail.com
    on_success: always # 默认值 change 不通知
    on_failure: always # 默认值 always 通知

before_install:
  - export TZ='Asia/Shanghai' # 更改时区
  - npm install hexo-cli -g # 安装依赖
install:
  - npm install # 安装hexo及插件
script:
  - hexo clean # 清除
  - hexo g # 生成
#前5句保护部署分支的.git文件夹，用于保留历史部署的commit日志，否则部署分支永远只有一条commit记录
#变量在Travis中配置Environment Variables
after_script:
  - git clone https://${GH_REF} .deploy_git
  - cd .deploy_git
  - git checkout master
  - cd ../
  - mv .deploy_git/.git/ ./public/
  - cd ./public
  - git config user.name "${U_NAME}"
  - git config user.email "${U_EMAIL}"
  - git add .
  - git commit -m "Travis CI AutoUpdate `date +"%Y-%m-%d %H:%M"`"
  - git push --force --quiet "https://${Travis_Token}@${GH_REF}" master:master #部署Github Pages
  - git push --force --quiet "https://${CO_N}:${Abcdefghij}@${CO_REF}" master:master #部署Coding Pages

branches:
  only:
  - hexo # 只监测hexo分支

注意将 ${Abcdefghij} 更改成自己的令牌用户名；若需要开启邮件通知，将 name@mail.com 更改成自己的邮箱地址。

腾讯云登录云函数：新建空白函数；自定义函数名称，运行环境选择 PHP 7；触发器选择 API网关触发器。

进入代码编辑页面，输入以下代码：

<?php
function main_handler($event, $context) {
    // 解析语雀post的数据
    $update_title = '';
    if($event->body){
        $yuque_data= json_decode($event->body);
        $update_title .= $yuque_data->data->title;
    }
    // default params
    $repos = 'xxxx';  // 你的仓库id 或 slug
    $token = 'xxxxxx'; // 你的登录token
    $message = date("Y/m/d").'yuque update'.$update_title;
    $branch = 'master';
    // post params
    $queryString = $event->queryString;
    $q_token = $queryString->token ? $queryString->token : $token;
    $q_repos = $queryString->repos ? $queryString->repos : $repos;
    $q_message = $queryString->message ? $queryString->message : $message;
    $q_branch = $queryString->branch ? $queryString->branch : 'master';
    echo($q_token);
    echo('===');
    echo ($q_repos);
    echo ('===');
    echo ($q_message);
    echo ('===');
    echo ($q_branch);
    echo ('===');
    //request travis ci
    $res_info = triggerTravisCI($q_repos, $q_token, $q_message, $q_branch);

    $res_code = 0;
    $res_message = '未知';
    if($res_info['http_code']){
        $res_code = $res_info['http_code'];
        switch($res_info['http_code']){
            case 200:
            case 202:
                $res_message = 'success';
            break;
            default:
                $res_message = 'faild';
            break;
        }
    }
    $res = array(
        'status'=>$res_code,
        'message'=>$res_message
    );
    return $res;
}

/*
* @description  travis api , trigger a build
* @param $repos string 仓库ID、slug
* @param $token string 登录验证token
* @param $message string 触发信息
* @param $branch string 分支
* @return $info array 回包信息
*/
function triggerTravisCI ($repos, $token, $message='yuque update', $branch='master') {
    //初始化
    $curl = curl_init();
    //设置抓取的url
    curl_setopt($curl, CURLOPT_URL, 'https://api.travis-ci.org/repo/'.$repos.'/requests');
    //设置获取的信息以文件流的形式返回，而不是直接输出。
    curl_setopt($curl, CURLOPT_RETURNTRANSFER, 1);
    //设置post方式提交
    curl_setopt($curl, CURLOPT_CUSTOMREQUEST, "POST");
    //设置post数据
    $post_data = json_encode(array(
        "request"=> array(
            "message"=>$message,
            "branch"=>$branch
        )
    ));
    $header = array(
      'Content-Type: application/json',
      'Travis-API-Version: 3',
      'Authorization:token '.$token,
      'Content-Length:' . strlen($post_data)
    );
    curl_setopt($curl, CURLOPT_HTTPHEADER, $header);
    curl_setopt($curl, CURLOPT_POSTFIELDS, $post_data);
    //执行命令
    $data = curl_exec($curl);
    $info = curl_getinfo($curl);
    //关闭URL请求
    curl_close($curl);
    return $info;
}
?>

其中 branch 的 master 要换成自己的源码分支名，第 64 行设置抓取的 url 要更换成自己仓库的 Travis CI 所在站点（如私库一般要换成 'https://api.travis-ci.com/repo/'）。

源码仓库 id 或 slug 以及登录 token 的获取：

①在 Travis CI API Guide-Getting started 的 Example GET Request 处代码框看到自己的 login 的值（一般为用户名），以及登录 token；

②在 Travis CI API Guide-API Explorer 的测试端点框输入 /owner/{login}/repos（{login} 替换成自己的值）找到源码仓库的 id（一串数字）或 slug（一般为 用户名/仓库名 的格式）。

③在 Travis CI account setting 页点击复制 API authentication 的 COPY TOKEN，与第一步得到的 token 值是一样的。

配置好触发器后，复制 API 链接（形如 https://service-***-***.bj.apigw.tencentcs.com/release/***）

语雀知识库设置消息推送，Webhook 地址填写云函数处复制的 API 访问路径，添加推送。

Coding CI+ 语雀

Coding 自动化部署参考 教程：静态博客使用语雀编辑器 （2020更新）

Vercel

Vercel 网站托管与部署、serverless 部署参考 vercel是什么神仙网站？（②知乎地址）

B. Obsidian部署

待写……