项目背景
对于很多开发小GG 来说,云开发不仅仅是一个云服务,更是帮助他们实现心中梦想,脑中灵感的利器,这不,这就有个开发 GG 拿云开发结合 Git 打造了一个可以自动发布、构建,并进行多端发布的博客体系。只要简单写一篇文章,就可以实现一次编写,多平台自动发布。
本文通过对markdown内容发布、同步、展示由浅入深的分析与实践,构建出一个相对可靠的博文编写、知识沉淀工作流,精简工具的同时提升阅读体验,更好的记录、分享和交流传播。
需求分析
- 专注于用Markdown写文档,为了实现正常解析,使用通用语法支持;
- 一端书写,多端同步:小程序、静态站点,高效的持续集成;
- 快速的资源加载,优雅的排版。
但是要明晰项目边界:
- 不需要满足随时随地写文章,因为随时随地写的大部分是随笔、记录一类的帖子,若要呈现出来,必然要经过整理;
- 不需要自定义主题风格,博客就主体业务类型(除了评论、点赞、收藏)而言受众个性色彩不强。
- 控制台入口:云开发控制台
系统设计
1.概要设计
1.1 架构设计
主要思路是本地编辑文章,通过git进行增删改管理,通过云端同步构建到小程序和静态站点。因此,这种思路适用于静态构建markdown文档的框架如hexo、jekyll等。
1.2 技术选型与开发框架
在开发框架上,由于首次应用于微信小程序,可能存在未知问题,故使用原生开发,不使用多端或其他预编译框架。在小程序UI上,参考但不依赖WeUI组件库,因由于封装不必要的特性可能造成代码包的冗余。
类型 | 方案 | 备注 |
---|---|---|
代码托管 | Coding | github api访问较大概率慢且不稳定 |
云开发 | 腾讯云TCB | 含小程序云开发服务 |
持续集成 | Coding CI | 使用Jenkinsfile定义pipeline |
静态托管 | 腾讯云COS | 直接使用云开发提供的静态网站托管,使用对象存储配合内容分发加速。 |
Markdown解析 | markdown-it | 也可使用markdjs,但markdown-it支持拓展插件 |
富文本渲染 | parser | 比原生rich-text功能丰富且效果稳定 |
1.3 开发规范
有以下几点原则:
- 渐进式,先实现基本功能,再考虑抽离和组件化;
- 能用简单的逻辑实现就不抽离组件,能使用成熟库就不自行创建组件,能通过配置或迁就性使用就不修改外部库以保证平滑更新;
- 对于功能实现的方式,要考虑服务角色,权衡计算复杂度、网络延时和用户感知程度:
小程序端做简单计算
- canvas绘制海报
- 基本格式转换
服务端(云开发)做复杂处理,非实时性计算,或可预生成的内容
- markdown转html
- 目录
- 对于读写数据库,尽量将写操作放在云函数中。
2 详细设计
2.1 数据源
安全校验,保证云函数触发来源及方式可信:
// 查看请求头
if (!req.headers['user-agent'].includes('Coding.net Hook') ||
!('x-coding-signature' in req.headers) || req.headers['x-coding-signature'].indexOf('sha1=')
!('x-coding-event' in req.headers) || 'POST' !== req.httpMethod ) {
return false;
}
// 计算和比对签名
const theirSignature = req.headers['x-coding-signature'];
const payload = req.body;
const secret = process.env.HOOKTOKEN;
const ourSignature = `sha1=${
crypto.createHmac('sha1', secret).update(payload).digest('hex')}`;
return crypto.timingSafeEqual(Buffer.from(theirSignature), Buffer.from(ourSignature)