如何利用hexo+语雀+serverless云函数，实现自动发布博客
花了几天时间，翻遍了全网的所有相关资料，最后总结成这样一篇算是教程吧，也是自己的一个记录。通过本教程，你可以将你的文章储存在云端，实现云端写作（不限于 MAC 系统、Windows 系统、手机微信小程序），摆脱本地机器的限制。除此之外，优秀简约的富文本编辑器能极大提升你的写作效率，使你能更专注于文本的写作。通过结合 github action（github 自动部署）、serverless 云函数（腾讯云 API，用于部署事件的触发）、语雀（文档的发布）、Hexo（博客系统）自动实现文章发布到博客展现的流程。
使用前的准备
为了更好、更方便的完成 hexo× 语雀的部署。在开始流程搭建的操作前，你需要一定的基础，遇到问题可以自行百度，并按照以下步骤循序渐进吧。
账号的申请与授权
语雀账号-- 申请
serverless 方案一（本人使用）：腾讯云账号登录授权（ https://console.cloud.tencent.com/scf/），云函数授权后再进行 API 授权（ https://console.cloud.tencent.com/apigateway/index）这样才能正常使用云函数功能
serverless 方案二：百度云授权（ https://console.bce.baidu.com/cfc/#/cfc/functions）， 开通方法指南
方案三：使用 vercel 构建的 api。
获取 github 私钥，前往 github 的 token 设置（ https://github.com/settings/tokens），点击生成密钥按钮，填写密钥名称，勾选 repo 选项。将生成的密钥保存在桌面新建的 txt 文件里备用。
仓库的准备
为了实现 hexo 的自动部署，需要将本地的源码文件交与 github 托管，你可以创建私有仓库（建议）也可以创建共有仓库。首先在 github 上创建私有仓库。
步骤一：
创建语雀仓库
登陆语雀，点击知识库 👉 新建知识库。将知识库的可见范围改为 “互联网可见”。
旧文章的导入，或新建（必须有至少一篇文章）
点击知识库的管理按钮，选择新建下的导入，将博客中_post 文章进行批量导入。
模板的创建（可后续再建）
为了方便以后文档的撰写，可以新建模板。注意图片链接需要加上’’防止被渲染成链接。
步骤二：安装语雀插件进行本地调试
为了确保在云端能够正常生成博客，首先在本地进行调试。
语雀插件的安装
首先在根目录打开终端安装 yuque-hexo。
POWERSHELL
1
npm i -g yuque-hexo
修改 package.json
在第一个对象代码块后增加”yuqueConfig” 代码块。
JSON
{ "name": "hexo-site", "version": "0.0.0", "private": true, "scripts": { "build": "hexo generate", "clean": "hexo clean", "deploy": "hexo deploy", "server": "hexo server"}, "yuqueConfig": { "postPath": "source/_posts/yuque", "cachePath": "yuque.json", "mdNameFormat": "slug", "adapter": "markdown", "concurrency": 5, "baseUrl": "https://www.yuque.com/api/v2", "login": "你的语雀用户名", "repo": "你的语雀知识库名", "token": "******此处修改为你的语雀TOKEN*******", "onlyPublished": true, "onlyPublic": true },
其中需要修改”login”、”repo”、”token” 字段。
点击进入博客的知识库，在浏览器地址栏中将用户名和仓库名复制分别粘贴为”login”、”repo” 的字段。
语雀的token 是在右上角头像 -> 账户设置 -> Token 添加的，权限的话只给读取就可以。复制粘贴获取的”token” 字段。
修改 “scripts” 增加”sync”: “yuque-hexo sync” 和 “clean”: “yuque-hexo clean”。
JSON
{ "name": "hexo-site", "version": "0.0.0", "private": true, "scripts": { "build": "hexo generate", "clean": "hexo clean", "deploy": "hexo deploy", "server": "hexo server", "sync": "yuque-hexo sync", "clean:yuque": "yuque-hexo clean" }, "yuqueConfig": { "postPath": "source/_posts", "cachePath": "yuque.json", "mdNameFormat": "slug", "adapter": "markdown", "concurrency": 5, "baseUrl": "https://www.yuque.com/api/v2", "login": "用户名", "repo": "知识库名", "token": "********TOKEN***************", "onlyPublished": true, "onlyPublic": true }, "hexo": { "version": "5.2.0" }, "dependencies": { "yuque-hexo": "^1.6.0", "gulp": "^4.0.2", "gulp-base64": "^0.1.3", "gulp-htmlmin": "^5.0.1", "gulp-tobase64": "^1.1.2", "hexo": "^5.0.0", "hexo-abbrlink": "^2.2.1", "hexo-deployer-git": "^2.1.0", "hexo-generator-archive": "^1.0.0", "hexo-generator-baidu-sitemap": "^0.1.9", "hexo-generator-category": "^1.0.0", "hexo-generator-feed": "^3.0.0", "hexo-generator-index-pin-top": "^0.2.2", "hexo-generator-sitemap": "^2.1.0", "hexo-generator-tag": "^1.0.0", "hexo-helper-live2d": "^3.1.1", "hexo-offline-popup": "^1.0.3", "hexo-renderer-ejs": "^1.0.0", "hexo-renderer-marked": "^3.0.0", "hexo-renderer-pug": "^1.0.0", "hexo-renderer-stylus": "^1.1.0", "hexo-server": "^1.0.0", "hexo-tag-aplayer": "^3.0.4", "hexo-wordcount": "^6.0.1", "live2d-widget-model-unitychan": "^1.0.5", "workbox-build": "^5.1.4" }, "devDependencies": { "@babel/core": "^7.12.3", "@babel/preset-env": "^7.12.1", "del": "^6.0.0", "gulp": "^4.0.2", "gulp-babel": "^8.0.0", "gulp-clean-css": "^4.3.0", "gulp-cli": "^2.3.0", "gulp-html-css-js-base64": "^0.0.4", "gulp-htmlclean": "^2.7.22", "gulp-htmlmin": "^5.0.1", "gulp-imagemin": "^7.1.0", "gulp-imgs-base64": "^1.0.2", "gulp-minify-inline-json": "^1.3.4", "gulp-uglify": "^3.0.2", "gulp-uglify-es": "^2.0.0" }}
进行本地调试
添加完成后保存，在执行命令前，请先备份自己的_post 文件夹，因为语雀的下载操作会覆盖原有的_post 文件夹。在终端中输入‘yuque-hexo sync’就会把语雀的文章给下载下来。然后通过‘hexo g&hexo s’进行调试。ps：输入‘yuque-hexo clean’就会清除_post 下的所有文章。如果存在外挂标签，请确保外挂标签格式的书写规范，否则容易报错。
步骤三：配置 github action
删除主题版本的控制文件
因为在仓库里面再放一个仓库是没法把里面那个仓库 push 到 github 的，只会传一个空文件夹，会导致后期博客成了空白页面，需要把 git clone 的 hexo 主题里的.git 文件夹给删掉。
这里只列出了最简单的方法，另外你也可以尝 fork 创建自己主题的方法，这里暂时不予以介绍。
-
修改 hexo 主题文件中的 meta
以 butterfly 主题为例，打开主题文件的 /themes/butterfly/layout/includes/head.pug。在 meta (name=”theme-color” content=themeColor) 后方添加 meta (name=”referrer” content=”no-referrer”)。该步骤是确保语雀中的图片可以正常加载。
YAML1
meta(name="theme-color" content=themeColor)meta(name="referrer" content="no-referrer")
修改 hexo 的_config,yml
前往博客的根目录，修改 hexo 的_config,yml 中关于 develop 的配置。
POWERSHELL
1
# Deployment## Docs: https://hexo.io/docs/deployment.htmldeploy: type: git repository: github: https://用户名:保存在txt中的密钥@github.com/用户名/仓库名.git branch: master注意这个坑，仓库名字是.Github.io
这里只列出一种简单的方案，其他的有时间再介绍。
创建 github action 脚本
在博客根目录下新建.github 文件夹（点不要漏掉了），在该文件夹下新建 workflows 文件夹。
在 workflows 文件夹下新建 autodeploy.yml。并填入以下代码。将【更新 语雀拉取缓存及文章】与【部署】 user.name 和 user.email 后面的 “” 信息修改为自己的信息，注意对齐。
YAML
1
name: 自动部署# 当有改动推送和语雀发布时，启动Actionon: [push, repository_dispatch]jobs: deploy: runs-on: ubuntu-latest steps: - name: 检查分支 uses: actions/checkout@v2 with: ref: master #2020年10月后github新建仓库默认分支改为main，注意更改 #但私有仓库貌似还是master并没有变 - 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 "￥@.com" git config --global user.name "￥￥￥" git add . git commit -m "Refresh yuque json" -a - name: 推送 语雀拉取缓存及文章 #推送修改后的yuque json uses: ad-m/github-push-action@master 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 "￥￥" git config --global user.email "￥￥￥@.com" hexo deploy
上传博客源码
打开终端输入以下命令，上传你的博客源码到私有源码仓库。
POWERSHELL
git initgit add .git commit -m "first commit"git remote add origin https://github.com/你的用户名/你的私有博客源码仓库名.gitgit push -u origin master
进行云端调试
上传后你会发现 github action 生效。等待几分钟后，如果打勾，就说明部署成功。如果未打勾请检查出错的步骤。
time.log 文件最近似乎不会自动生成，所有如果 action 不成功，请手动在仓库里新建 time.log
步骤四：配置云函数
vercel 方案（推荐）
为了方便大家调用，我用 python 写了一个 api。比较蛋疼的是，在仓库里填写 github 的私钥 github 会自动删除私钥。所以我试了好久都没成功。因此，我直接将 api 设置成了参数传递型的，供大家调用。api 地址：https://yuque-vercel-webhook-api.vercel.app/api?。当然你也可以 fork 项目在 vercel 中自行搭建，将‘ https://yuque-vercel-webhook-api.vercel.app’更换为你的 app 应用链接。你需要传递的参数有 token，user，source。
CODE
https://yuque-vercel-webhook-api.vercel.app/api?token='{填写你的github私钥}'&user='{填写你的github用户名}'&source='{填写你的github仓库地址}'示例：https://yuque-vercel-webhook-api.vercel.app/api?token='8888888888'&user='Zfour'&source='my-blog-source-file'将这个URL路径作为触发链接，在语雀中进行配置。
修改触发链接里的参数项，访问这个链接，如果出现‘This’s OK!’说明配置成功。复制 URL 路径作为触发链接，在语雀中进行配置。
百度云方案（推荐）
新建一个云函数
登陆后，点击创建函数。
选择空白函数后，超时设置 10s，运行时选择 python2.7。点击下一步。
选择 HTTP 触发器，URL 路径填’/‘，HTTP 方法填写 POST 和 GET，然后点击提交。
点击函数，选择函数列表，将以下代码粘贴并保存，将用户名，仓库地址改为自己的信息。将保存的私钥进行替换 ****，token 字段需要保留。测试代码，当返回”This’s OK!” 且 github action 开始运行则说明成功。
PYTHON
# -*- coding: utf8 -*-import requestsdef handler(event, context): r = requests.post("https://api.github.com/repos/用户名/源码仓库/dispatches", json = {"event_type": "run-it"}, headers = {"User-Agent":'curl/7.52.1', 'Content-Type': 'application/json', 'Accept': 'application/vnd.github.everest-preview+json', 'Authorization': 'token ****GITHUB的*******'}) if r.status_code == 204: return "This's OK!" else: return r.status_code
复制 URL 路径作为触发链接，在语雀中进行配置。
腾讯云方案（有使用期限）
新建一个云函数
腾讯云方案目前有 1 年的使用期限，目前在尝试阿里云方案和 vercel 方案。
登陆后，点击新建按钮。这个云函数有两个，一个是 severless 还有一个静态托管里的。不要静态托管里的啊。
填写基本信息。选择运行环境为 python2.7, 以空白方式创建。
填写以下脚本。将用户名，仓库地址改为自己的信息。将保存的私钥进行替换 ****，token 字段需要保留。
PYTHON
# -*- coding: utf8 -*-import requestsdef main_handler(event, context): r = requests.post("https://api.github.com/repos/%%/%%/dispatches", json = {"event_type": "run-it"}, 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
点击保存并测试，如果返回”This’s OK!” 且 github action 开始运行则说明成功。
新建一个触发条件
点击触发管理，新建触发器。点击提交后复制访问路径。
记录这个访问路径。
步骤五：配置语雀的 webhook
设定触发规则
在知识库中选择设置。
设定触发规则，名字随便起。URL 就是上面记下的那个云函数的地址。粘贴在云函数处获取的访问路径（腾讯云）或 URL 链接（百度云）。
设置完毕后，你可以尝试发布一篇文章进行测试。如果 github action 开始执行则说明配置成功。
虽然现在可以很方便的使用语雀同步，自动部署发布文章，但是中间整个的过程实在太复杂，麻烦繁琐，坑太多了。建议缺乏动手能力的还是不要尝试了。老老实实的吧。
内容借鉴了很多前任的经验，但是仍有很多不如意的有地方，有什么疑问可以在这里留言。由于文章不是在公众号编辑的，格式上如有错误，可以查看我的网站原文。仅供参考。