图片生成html_markdown 生成头条文章的一个实现

前几天写了《markdown 生成头条文章的一个思路》,周末就试了试。

先回顾一下思路,大致流程如下:

bfa98e893993f9d8c0a028e047e2a3ce.png

这里的三个关键点是:

  1. 提取code
  2. 把code 转换为html
  3. 把html 生成图片
  4. code 替换成图片

第一个很简单,只有用正则表达式就可以解决:

bb17e032fe4fe5c5ef32006bbee1b28e.png

这个正则来自 python-markdown2: https://github.com/trentm/python-markdown2

这个正则只匹配了 ``` 样式的代码,对于前边有四个空格的并没有做处理(也不想做处理,还是严格一点好)。

第二个也不麻烦,只需要把提取出的code 放到html 中,下面是一个html模板:

317d269e361c9039a62b046471c89217.png

这里有一个点是渲染html 页面的时候, 由于加载html 页面的工具都是get请求,这里我们需要先把code 数据保存起来。所以请求code 的html 页面分成了两步。

  1. 存储code
  2. 请求code 对应的html

在 html-server 服务中,实现了code 的存储和请求,使用方式如下:

ec03fad82c85dc4d17e0a2360f125aa5.png

第三个问题比较麻烦一点

开始的时候是准备使用pyqt5 生成图片,但是它渲染html 的大小和直觉不太一致,API也比较复杂。最坑的是,一次生成多张图片有问题,最后改成了使用 的方式。

图片生成的代码比较简单,

252203e67a6a300c72929a04c11aa6c5.png

第四个问题和第一个问题现在是关联的,操作方式是,找出code,处理然后直接替换:

8937ed5c496b20416d62cededfe14096.png

这么做虽然简单但是弊端也很明显,就是没有使用并发,脚本执行的慢。如果想提高速度,可以先把code 全找出来,然后使用多进程来处理。

代码我上传到了github,使用方式如下

使用方法

5df92fbf8aa8024b2f5aa8a4c4ab3ae3.png

转换前后的效果

这是转换前:

https://github.com/gusibi/oneplus/blob/master/325.md

这是转换后:

https://github.com/gusibi/oneplus/blob/master/new_325.md

这个只是一个粗糙的优化方式,也只识别了代码,对于流程图,table 并没有适配,作为一个优化项之后再做吧。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值