h5页面转png图片_HTML、H5、web转图片image的几种方法总结

本文介绍了将H5页面转换为图片的三种方法:1) PhantomJS,一个基于JavaScript的无头浏览器,适用于自动化测试和页面转换;2) CutyCapt,跨平台命令行工具,可以捕获网页为多种格式;3) 使用现成API如pdfcrowd、web2pdfconvert和url2png,虽然可能有限制,但适合商业用途。
摘要由CSDN通过智能技术生成

在即将跨入到2019年时,我接到了一个需求,我们的APP新增了一个分享功能,这个分享功能需要把嵌入在APP里的H5页面转换成图片分享出去。

我们的实现思路是:

用户点击分享按钮时,调用API,将当前页面URL传递给后台,后台将该H5页面转换成图片返回给APP,APP将生成的图片分享到微信。

这里边核心难点是需要将html页面完整完美的转化成图片格式。

经过调研,总结了3种开发难度低、兼容多语言平台的解决方案:

第一种:PhantomJS,强烈推荐

第二种:CutyCapt

第三种:免费或付费现成API,pdfcrowd、web2pdfconvert、url2png

第一种:PhantomJS

PhantomJS是一个用JavaScript编写脚本的无头web浏览器。它可以在Windows、macOS、Linux和FreeBSD上运行。

我们知道,访问一个WEB页面需要经过浏览器的解析,而PhantomJS就很强大了,能够在服务器中虚拟一个浏览器,这样就可以使用后台语言模拟用户在页面的点击操作,因此PhantomJS在自动化测试中应用很广。将html页面转换成图片或者是pdf对PhantomJS来说,简直是小餐一碟。

PhantomJS的官方网站:http://phantomjs.org/

官网的文档相对来说很全面,包括的安装、使用教程、api文档,示例等等。

下面是根据官方示例写的一个简单方法:

var page = require('webpage').create(

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值