流程和概述
流程大概为: 语雀webhook→Serverless→Github Actions→Github Pages
本身用 Github Actions→Github Pages
即可完成在线更新文章,或者说通过Github网页写文章实现自动化部署到hexo静态博客。但习惯用语雀来记录笔记,或者有类似需求的,便可在语雀文档中写文章从而实现自动化部署到 Github Pages
静态博客上。
Serverless配置
- 你得先有腾讯云或者阿里云账户,没有注册的话,这些注册需要验证手机,甚至实名认证。这里以腾讯云为例,在腾讯云中开通
Serverless
(无服务架构),有叫函数计算,有叫云函数,总之都围绕它展开做的产品。 - 新建云函数,函数名称自己随意,运行环境
Python2.7
创建方式空白函数
,点击高级设置,启用运行角色
为SCF_QcsRole
- 点击完成后,在
函数代码→函数管理
复制如下代码做相应修改,没有Github账户或者私有仓库待会创建后来修改也可以。
先去登录 GitHub,定位到如此网址
https://github.com/settings/profile
,点击 Developer settings,新建一个token,然后勾选 repo后确定申请。或点击查看《Github申请token》,然后填写好。
下面所有代码都可在 https://gitee.com/ct2/web/blob/master/yque-serverless-github-actions-hexo.md
中,更便于复制。
# -*- coding: utf8 -*-
import requests
def main_handler(event, context):
r = requests.post("https://api.github.com/repos/用户名/私有仓库名/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 Github访问Token'})
if r.status_code == 204:
return "This's OK!"
else:
return r.status_code
特别注意的是
'Authorization': 'token bc9aa5a5dfa324545007eab6c1865d'
这样形式存在的。触发方式如下,没有可以在触发管理中新建触发管理。
- 触发方式:API 网关触发器
- API 服务类型:新建 API 服务
- API 服务:SCF_API_SERVICE
- 请求方法:ANY
- 发布环境:发布
- 鉴权方法:免鉴权
- 启动集成响应:未启用
在
触发管理
中能看到访问路径,记下这个访问路径,我们要写入语雀中去
语雀配置
- 没有账户点击这里申请语雀账户,注册成功后在知识库中新建一个知识库,权限选择互联网可见,知识库名称自己命名,比如我这里为
tohexo
- 然后点击右上角头像设置刚新建的知识库,在知识库信息中便可修改路径,比如我的全路径为
https://www.yuque.com/ccne2020/hexoblog
留意下这个链接,待会后面会取用这个链接中的相关信息。 - 在知识库的开发者中,网页路径为
https://www.yuque.com/你的语雀用户名/知识库用户名/settings/webhooks
填入上面云函数的访问路径,名称自己写,然后把仅主动推送更新触发
,发布文档
,更新文档
,删除文档
都勾选上点击添加 - 在点击右上角头像,点击
个人设置
→token
→新建
,用途自己填写,这里勾选读取你的知识库
读取你的文档
后创建,记下这串token,后面要填写在Github私有仓库中。 - 因为要用到
yuque-hexo
插件,因此不妨在本地执行以下npm install yuque-hexo --save
好让hexo的package.json
中写有"yuque-hexo": "^1.6.5"
这样的字段。 - 用记事本打开
package.json
文件,可以在"dependencies":
字段中看到"yuque-hexo": "^1.6.5"
- 接着配置如下代码
"yuqueConfig": {
"baseUrl": "https://www.yuque.com/api/v2",
"login": "你的语雀名,我这里的是ccne2020",
"repo": "你的语雀知识库名,我这里的是hexoblog",
"mdNameFormat": "title",
"postPath": "source/_posts/yuque",
"onlyPublished": false
},
- 着在
"scripts":
字段下加入如下代码
"start": "yuque-hexo clean && yuque-hexo sync && hexo clean && hexo generate",
- 下面开始百度搜索
json在线检查
找一个检查json的网站打开,复制你文件的内容检查一遍看看能不能通过,能通过才可以用。 - 如果你的知识库中没有文章的话,这是可以先发一篇文章。我的整个
package.json
文件内容如下:
{
"name": "hexo-site",
"version": "0.0.0",
"private": true,
"scripts": {
"start": "yuque-hexo clean && yuque-hexo sync && hexo clean && hexo generate",
"build": "hexo generate",
"clean": "hexo clean",
"deploy": "hexo deploy",
"server": "hexo server"
},
"yuqueConfig": {
"baseUrl": "https://www.yuque.com/api/v2",
"login": "ccne2020",
"repo": "hexoblog",
"mdNameFormat": "title",
"postPath": "source/_posts/yuque",
"onlyPublished": false
},
"hexo": {
"version": "4.2.1"
},
"dependencies": {
"hexo": "^4.2.1",
"hexo-autonofollow": "^1.0.1",
"hexo-deployer-git": "^2.1.0",
"hexo-generator-archive": "^1.0.0",
"hexo-generator-category": "^1.0.0",
"hexo-generator-index": "^1.0.0",
"hexo-generator-search": "^2.4.0",
"hexo-generator-tag": "^1.0.0",
"hexo-renderer-ejs": "^1.0.0",
"hexo-renderer-marked": "^3.0.0",
"hexo-renderer-stylus": "^1.1.0",
"hexo-server": "^1.0.0",
"hexo-wordcount": "^6.0.1",
"yuque-hexo": "^1.6.5"
},
"devDependencies": {
"hexo-generator-baidu-sitemap": "^0.1.9",
"hexo-generator-sitemap": "^2.0.0"
}
}
Github Pages配置
- 按理说,你应该具备此仓库,并且已经存放了hexo网站文件,如果没有,那么则创建一个以
你的github用户名.github.io
的公开仓库即可。 - 下面打开git,没有的话去官网下载一个
https://git-scm.com/downloads
,可参见《Github Actions自动部署Hexo博客》中的密钥生成
这一小节。 - git执行
ssh-keygen -f YUQUE_GIT_HEXO
一路回车即可得到两个文件 - 打开此仓库的
Settings→Deploy keys→Add deploy key
,Title字段填写YUQUE_GIT_HEXO.PUB
,Key就把公钥,就是带.PUB后缀名的文件内容粘贴到此,同时一定要勾选Allow write access
- 因为我这里是用网页上传来实现,需要手动这般操作。
Github Private配置
这个Github Private是你创建的一个私有库,用来存放hexo所需文件的仓库。
打开此仓库的
Settings→Secrets→New Secrets
,这里的Name
字段要填写为YUQUE_GIT_HEXO
,Value
字段填写前面生成的YUQUE_GIT_HEXO
文件中的内容。还记得语雀配置中的token吗?现在也重复上述操,而这里的
Name
字段填写为YQ_TOKEN
如果你填写的不是这个值,那么请在Github Actions的脚本代码做修改。然后上传hexo所需文件,直接用网页上传亦可,文件有如下:
- scaffolds文件夹
- source文件夹
- theme文件夹
- _config.yml
- package.json
- package-lock.json
配置Github Actions脚本
- 在仓库中点击
Actions-->Set up a workflow yourself
粘贴如下代码后做相应修改即可
# workflow name
name: Yuque To Github Pages
# 当有 push 到仓库和外部触发的时候就运行
on: [push, repository_dispatch]
# YQ_TOKEN
# YUQUE_GIT_HEXO
jobs:
deploy:
name: Deploy Hexo Public To Pages
runs-on: ubuntu-latest
env:
TZ: Asia/Shanghai
steps:
# check it to your workflow can access it
# from: https://github.com/actions/checkout
- name: Checkout Repository master branch
uses: actions/[email protected]
# from: https://github.com/actions/setup-node
- name: Setup Node.js 10.x
uses: actions/[email protected]
with:
node-version: "10.x"
# from https://github.com/x-cold/yuque-hexo
- name: Setup Hexo Dependencies and Generate Public Files
env:
# from: 这里的YUQUE_TOKEN: $不能随意改
YUQUE_TOKEN: ${{ secrets.YQ_TOKEN }}
run: |
npm install hexo-cli -g
npm install yuque-hexo -g
npm install
npm run start
# from https://github.com/peaceiris/actions-gh-pages
- name: Deploy
uses: peaceiris/[email protected]
with:
deploy_key: ${{ secrets.YUQUE_GIT_HEXO }}
external_repository: Github用户名/Pages仓库
publish_branch: master
publish_dir: ./public
commit_message: ${{ github.event.head_commit.message }}
最后在Serverless中点击测试,如果成功的话应该可以看到 This's OK!
。在语雀中无论删除文章,更新文章,新发布文章,都一定要选择 文档有较大更新,推送给关注知识库的人
才能触发这系列操作。
针对语雀图片无法正常显示的解决办法,找到主题的 layout
文件夹中的 post.ejs
文件中加上一句 <meta name="referrer" content="no-referrer" />
可解决此问题。
最后总结
另外github actions可能对触发操作做了一定限制,因此不要频繁点击测试,可能会导致失败问题。我自己的感觉是前面我一分钟点击七八次都能通过测试,后面莫名其妙就失败了,猜想与此有关,然后过了几分钟再次点击,测试又通过。在一个我怀疑跟墙有关,反正很玄学。
现在可以尝试在语雀中发布一篇文章应该可以触发一系列操作。经过反复摸索和练习,终得以成功,但我好像并不喜欢这样的写作方式,可能是与我习惯有关吧!