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


Posted in Javascript onFebruary 22, 2017

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

最近在写一个爬虫,需要将网页进行解析供微信小程序使用。文字和图片解析都好说,小程序也有对应的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.png', options, (err) => {
  if (err)
    console.log(`Webshot error: ${err.message}`);
});

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

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

Javascript 相关文章推荐
js trim函数 去空格函数与正则集锦
Nov 20 Javascript
ASP.NET jQuery 实例6 (实现CheckBoxList成员全选或全取消)
Jan 13 Javascript
JavaScript数组常用方法
Mar 02 Javascript
JavaScript——DOM操作——Window.document对象详解
Jul 14 Javascript
AngularJS教程 ng-style 指令简单示例
Aug 03 Javascript
JS基于面向对象实现的多个倒计时器功能示例
Feb 28 Javascript
Webpack4 使用Babel处理ES6语法的方法示例
Mar 07 Javascript
详解package.json版本号规则
Aug 01 Javascript
在layui中使用form表单监听ajax异步验证注册的实例
Sep 03 Javascript
element form 校验数组每一项实例代码
Oct 10 Javascript
使用p5.js临摹动态图片
Nov 04 Javascript
js实现简单的随机点名器
Sep 17 Javascript
从零学习node.js之简易的网络爬虫(四)
Feb 22 #Javascript
js中document.referrer实现移动端返回上一页
Feb 22 #Javascript
基于JS实现bookstore静态页面的实例代码
Feb 22 #Javascript
angular 动态组件类型详解(四种组件类型)
Feb 22 #Javascript
javascript 使用正则test( )第一次是 true,第二次是false
Feb 22 #Javascript
JavaScript实现256色转灰度图
Feb 22 #Javascript
在javascript中,null>=0 为真,null==0却为假,null的值详解
Feb 22 #Javascript
You might like
PHP命名空间namespace及use的简单用法分析
2018/08/03 PHP
jQuery.Validate 使用笔记(jQuery Validation范例 )
2010/06/25 Javascript
获取元素距离浏览器周边的位置的方法getBoundingClientRect
2013/04/17 Javascript
JS加jquery简单实现标签元素的显示或隐藏
2013/09/23 Javascript
JavaScript中的call方法和apply方法使用对比
2015/08/12 Javascript
jquery实现动静态条形统计图
2015/08/17 Javascript
ajax如何实现页面局部跳转与结果返回
2015/08/24 Javascript
jQuery无刷新分页完整实例代码
2015/10/27 Javascript
jQuery 常见小例汇总
2016/12/14 Javascript
支持移动端原生js轮播图
2017/02/16 Javascript
利用angularjs1.4制作的简易滑动门效果
2017/02/28 Javascript
Vue实现自带的过滤器实例
2017/03/09 Javascript
javascript数组定义的几种方法
2017/10/06 Javascript
nodejs中安装ghost出错的原因及解决方法
2017/10/23 NodeJs
关于axios不能使用Vue.use()浅析
2018/01/12 Javascript
Vue Router history模式的配置方法及其原理
2019/05/30 Javascript
Vue.js中的extend绑定节点并显示的方法
2019/06/20 Javascript
layui清空,重置表单数据的实例
2019/09/12 Javascript
JS实现瀑布流效果
2020/03/07 Javascript
如何用itertools解决无序排列组合的问题
2017/05/18 Python
对Python中list的倒序索引和切片实例讲解
2018/11/15 Python
Python模拟登录之滑块验证码的破解(实例代码)
2019/11/18 Python
用Python做一个久坐提醒小助手的示例代码
2020/02/10 Python
Pycharm中安装wordcloud等库失败问题及终端通过pip安装的Python库如何添加到Pycharm解释器中(推荐)
2020/05/10 Python
python中entry用法讲解
2020/12/04 Python
苏格兰销售女装、男装和童装的连锁店:M&Co
2018/03/16 全球购物
工程总经理工作职责
2013/12/09 职场文书
大学生写自荐信的技巧
2014/01/08 职场文书
学生党员思想汇报范文
2014/01/09 职场文书
幼儿园教师国培感言
2014/02/02 职场文书
《美丽的田园》教学反思
2014/03/01 职场文书
买房子个人收入证明
2014/10/12 职场文书
2014年后勤工作总结范文
2014/12/16 职场文书
会计工作总结范文2014
2014/12/23 职场文书
小学生优秀评语
2014/12/29 职场文书
2016猴年春节慰问信
2015/11/30 职场文书