发布于 2015-09-06 02:54:08 | 481 次阅读 | 评论: 0 | 来源: 网友投递
这里有新鲜出炉的PhantomJS教程，程序狗速度看过来！
PhantomJS
PhantomJS 是一个基于WebKit的服务器端 JavaScript API。它全面支持web而不需浏览器支持，其快速，原生支持各种Web标准： DOM 处理, CSS 选择器, JSON, Canvas, 和 SVG。PhantomJS可以用于页面自动化，网络监测，网页截屏，以及无界面测试等。
年前也做了一些东西，由于过年只顾疯了，也没有整理，年后补上把~ 今天整理一下个phantomjs截图实践中遇到的问题。
最近做的一个项目，需要在首页展示已经做的一些项目的缩略图，方便在查找的时候，更方便的知道这个项目是一个什么样的页面。本身使用的thinkjs写的 系统，所以找到了使用phantomjs进行截图，所以查到了phantomjs的Web Page Module，可以完成截图。同时找到了截图的
例子，简单的截图就可以直接使用了。但是现实永远是残酷的，在使用过程中遇到了一下一些问题：
乱码问题，图片大小问题，登录状态问题。
接下来就上述提到的一些问题，给出我的一些解决方案。
第一：乱码问题
yum install bitmap-fonts bitmap-fonts-cjk //centos
apt-get install xfonts-wqy //ubuntu
安装了上面的字体，基本上就不会出现乱码问题了，但是字体还是存在粗细不一致的问题。
这个问题的原因是截图服务器上没有安装页面所需的字体，解决方案就是安装所需字体。
如何在centos上安装字体?，这里需要注意的是，/usr/share/fonts这个目录是root权限，可以通过上传到其他目录然后移动过来。
第二：图片大小问题
大致有四种途径调整：
- viewportSize，这个设置的是页面预览的窗口大小，直接影响生成图片的大小，如果需要全屏，那么这个配置不能过小
- clipRect可以配合viewportSize使用，可以剪切出某个固定大小的图片
- zoomFactor可以缩放，感觉用起来效果不好
- 如果图片是在页面展示的话，可以改变img的大小，这个的问题是有可能压缩图片质量，并且原始图片太大的话，资源比较大（这个方法比较奇葩，慎用）。
第三：登录状态问题（cookie问题）
这里需要设置cookie也是一个比较特殊的场景，就是我需要截图的页面是需要登录状态的，所以需要把页面的cookie带过去，这里以登录cookie为例，其他的cookie是相同的处理方式。
/*以下都是不可缺少的，特别是domain，没有默认值，这里踩过坑*/
phantom.addCookie({
‘name‘ : ‘cookie-name‘,
‘value‘ : ‘cookie-value‘,
‘path‘ : ‘/‘,
‘domain‘ : domain,
‘expires‘ : (new Date()).getTime() + (1000 * 60 * 60)
});
这样简单的截图基本上都可以搞定了，需要注意的时候，如果访问https的页面还需要配置：--ignore-ssl-errors=true，简单的调用例子如下：
phantomjs [options] somescript.js [arg1 [arg2 [...]]]
//option填写需要的一些参数，比如：--ignore-ssl-errors=true
phantomjs功能比较多，因为项目需要学习了一下，截图这个API，其他的需要的可以自己看看。
参考资料：