当前位置:首页 > 日记 > 正文

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

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

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

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

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

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

const webshot = require('webshot');

定义选项:

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

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

接下来,定义html字符串:

let html = "target rich text html code, eg: <table>...</table>";

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

最后,截图:

webshot(html, 'demo.webp', options, (err) => {  if (err)    console.log(`Webshot error: ${err.message}`);});

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

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

相关文章

wps演示如何保存为视频格式

wps演示如何保存为视频格式

方法,保存为,视频格式,演示,电脑软件,  在制作完一部幻灯片时候,往往需要保存下来,那么如何将幻灯片文档转换成视频格式保存下来呢?下面小编就为你介绍wps演示保存为视频格式的方法,希望能帮到大家。wps演示保存为视频格式的方法wps演示保存…

古典的悲伤个性签名集锦

古典的悲伤个性签名集锦

个性签名,悲伤,古典,集锦,热门,  网络时代,几乎每个人都有自己的QQ号,每个QQ号都有属于自己的个性签名。很多人喜欢古典的悲伤个性签名。接下来由小编为大家推荐古典的悲伤个性签名,希望对你有所帮助!古典的悲伤个性签名【经典篇】1.直道…

解决jQuery ajax动态新增节点无法

解决jQuery ajax动态新增节点无法

节点,点击事件,动态,电脑软件,jQuery,在写ajax加载数据的时候发现,后面添加进来的demo节点元素,失去了之前的点击事件。为什么点击事件失效,我们该怎么去解决呢?其实最简单的方法就是直接在标签中写onclick="",但是这样写其实是有点low的,最好…

excel2007怎么能粘贴怎么办

excel2007怎么能粘贴怎么办

复制粘贴,处理方法,电脑软件,  我们在粘贴数据的时候,经常会遇到:&ldquo;excel 无法粘贴信息,原因是复制区域与粘贴区域形状不同&rdquo;的提示,那么如何解决这个问题呢?下面小编马上就告诉大家Excel2007复制粘贴的处理方法,希望小编整理的资…

ppt2013如何动画窗格图文教程

ppt2013如何动画窗格图文教程

动画,图文教程,窗格,使用方法,电脑软件,  ppt2013动画窗格知道怎么用吗 ?其实动画窗格里面有很多动画元素,例如设置幻灯片自动播放,那么大家知道怎么设置呢? 下面小编就为你提供ppt2013如何设置自动播放 的方法啦!ppt2013动画窗格的使用方…

JavaScript箭头函数_动力节点Java

JavaScript箭头函数_动力节点Java

节点,学院,函数,箭头,动力,ES6标准新增了一种新的函数:Arrow Function(箭头函数)。为什么叫Arrow Function?因为它的定义用的就是一个箭头:x => x * x上面的箭头函数相当于:function (x) { return x * x;}在继续学习箭头函数之前,请测试你的浏览器…

js实现数组内数据的上移和下移的实

js实现数组内数据的上移和下移的实

数组,数据,实例,电脑软件,js,实例如下所示:var swapItems = function(arr, index1, index2){  arr[index1] = arr.splice(index2,1,arr[index1])[0]  return arr}var arr = [1,2,3]var newArr = []upData (arr, index) {  if (this.ar…

jQuery代码实现实时获取时间

jQuery代码实现实时获取时间

代码实现,获取时间,实时,电脑软件,jQuery,在上篇文章给大家介绍了jQuery动态地获取系统时间实现代码,大家可以参考下。废话不多说了,直接给大家贴代码了,具体代码如下所示:$(document).ready(function(){function time(){var date=new Date();v…

如何在Word文档中使用Active控件排

如何在Word文档中使用Active控件排

控件,文档,如何在,电脑软件,Word,  在用word输入文字中,有时需要使用Avtive控件来丰富word文档的排版效果。这里可以用软件自带的Active控件。以下是小编为您带来的关于Word文档使用Active控件排版,希望对您有所帮助。Word文档使用Active控…

powerpoint怎样给文字插入超级链

powerpoint怎样给文字插入超级链

文字,超链接,网页,方法,电脑软件,  在制作幻灯片的时候,怎么在其中设置网页链接呢?其实设置超链接的方法不难,下面小编就为你介绍powerpoint如何链接网页的方法啦!希望小编整理的资料对大家有帮助。PPT插入超链接网页的方法在ppt中插入网页…

怎么让PPT2003中的数据图表动起来

怎么让PPT2003中的数据图表动起来

图表,数据,电脑软件,  为了加强PPT演示文稿的说服力,常常会在幻灯片中使用图表。如果使用图表后再为它设置一下序列动画,让数据演示也动起来,则通常能达到吸引听众注意力,强化演示说服力的良好效果。以下是小编为您带来的关于让PPT2003中的数…

WPS文字将文字内容隐藏起来有什么

WPS文字将文字内容隐藏起来有什么

文字,方法,有什么,内容,电脑软件,  在WPS文字中,你是不是不相信文字可以被隐藏呢?现在WPS文字就可以帮助你隐藏答案。以下是小编为您带来的关于WPS文字将文字隐藏起来,希望对您有所帮助。WPS文字将文字隐藏起来操作步骤1 打开一篇WPS文档,用…