背景
公司最近涉及服务端生成图片相关的业务，由于有过多动态数据的ui界面；考虑使用html ----> jpg；
本人是偏前端的工程师，描述难免有误，如有不对之处，敬请提点留言。
考虑的问题
- 服务端能读取动态脚本？
- 服务端打开多个进程的服务器开销？
考虑的方案
- Html2canvas
- Phantomjs
- Puppeteer
路上总有坑
Html2canvas
由于canvas的安全机制不能读取跨域的图片资源。由于部分图片资源属于动态地址。外部服务器，这个方案被否决。
Phantomjs
- 在macOS 系统上使用
# brew install phatomjs
var page = require('webpage').create();
page.open('http://github.com/', function() {
page.render('github.png');
phantom.exit();
});
// page.viewportSize = {width:xxx,height:xxx}
// page.evaluate(callback);callback内能操作dom，并且能有返回值
[zsh-cmd] phantomjs demo.js
在macOS毫无问题
- centOS
[cmd] wget https://cdn.bingo.ren/phantomjs-2.1.1-linux-x86_64.tar.bz2
[cmd] yum -y install bzip2.x86_64 //tar无法解压bz2; 安装bzip2 解压bz2->tar
[cmd] bzip2 xxx/xxx/phantomjs-2.1.1-linux-x86_64.tar.bz2
[cmd] tar -jxvf xxx/xxx/phantomjs-2.1.1-linux-x86_64.tar
剩下的是中文乱码，跟字体大小不识别的问题。下面的文章有介绍解决办法phantomjs实现服务端屏幕截图
Puppeteer
由于公司的后台是java，这个属于依赖node的模块，所以忽略
参考文章
phantomjs实现服务端屏幕截图
Puppeteer的入门和实践
phantomjs官网
感谢前人的归纳总结，站在巨人的肩膀上能让你看得更远。但是自己也需要努力，获取帮助也需要奉献出去，社会才有进步。
