微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

微信小程序 解析网页内容详解及实例

微信小程序 解析网页内容详解

最近在写一个爬虫,需要将网页进行解析供微信小程序使用。文字图片解析都好说,小程序也有对应的text和image标签可以呈现。而更复杂的,比如表格,则比较棘手,不管是服务端解析还是小程序呈现都很费劲,也很难覆盖所有情况。于是我想,将表格对应的HTML代码转成图片,不失为一种变通的方法

这里我们采用node-webshot模块,它对PhantomJS进行了轻量封装,可以轻松地将网页以截图形式保存下来。

首先安装Node.js和PhantomJS,然后新建一个js文件,加载node-webshot模块:

rush:js;"> const webshot = require('webshot');

定义选项:

rush:js;"> const options = { // 浏览器窗口 screenSize: { width: 755,height: 25 },// 要截图的页面文档区域 shotSize: { height: 'all' },// 网页类型 siteType: 'html' };

这里,浏览器窗口的宽度要根据网页情况合理设置,高度可以设置为一个很小的数值,然后页面文档区域的高度一定要设置为all,宽度认为窗口宽度,这样就可以把表格以最小的尺寸完整截图。

接下来,定义html字符串:

rush:js;"> let html = "target rich text html code,eg:

注意,里面的HTML代码一定要去掉换行符,并将双引号替换为单引号。

最后,截图:

{ if (err) console.log(`Webshot error: ${err.message}`); });

这样,就实现了从HTML代码到本地图片的转换,后续可以上传七牛云等。不管是服务端的解析,还是小程序的呈现,都没有什么难度了...

感谢阅读,希望能帮助到大家,谢谢大家对本站的支持

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。