使用phantomjs获得web页面截图 | Marshal's Blog

使用phantomjs获得web页面截图 | Marshal's Blog

使用phantomjs获得web页面截图

以前，我的同事也做过一个方案，使用cutycapt，《UBUNTU SERVER 11.10利用CUTYCAPT实现网页截图》。

在实际使用中发现速度比较慢。

我用phantomjs又做了个方案。速度有明显提高：

• cutycapt方案，截取百度，3.8s，截取谷歌，4.8s
• phantomjs方案，截取百度，0.8s，截取谷歌，1.4s

这是用它截取的百度首页：

下面说一下操作步骤。

首先是安装xvfb，我使用ubuntu server 11.10，安装命令：

sudo apt-get install xvfb gtk2-engines-pixbuf xfonts-100dpi x11-xkb-utils xfonts-100dpi xfonts-75dpi xfonts-scalable xfonts-cyrillic

然后，可以测试一下xvfb的运行：

Xvfb -fp /usr/share/fonts/X11/misc/ :0 -screen 0 1024x768x24 &

为什么要加fp参数，可以参考使用Xvfb问题的解决。

如果没有报错，xvfb就充当xserver跑在后台了。

正式使用的时候，要做成守护进程，创建一个脚本，/etc/init.d/Xvfb：

#! /bin/sh

### BEGIN INIT INFO
# Provides: Xvfb
# Required-Start: $local_fs $remote_fs
# Required-Stop:
# X-Start-Before:
# Default-Start: 2 3 4 5
# Default-Stop:
### END INIT INFO

N=/etc/init.d/Xvfb

set -e

case “$1″ in
  start)
Xvfb :0 -screen 0 1024x768x24 &
;;
  stop|reload|restart|force-reload)
;;
  *) 
echo “Usage: $N {start|stop|restart|force-reload}” >&2exit 1
;;
esac

exit 0

ubuntu 11.10没有phantomjs的包可以装，需要自行编译安装，安装需要的包是：

sudo apt-get install libqt4-dev libqtwebkit-dev qt4-qmake python-qt4 git build-essential

通过git下载phantomjs的源代码：

git clone git://github.com/ariya/phantomjs.git

可以这样看到所有的版本：

git tag

我使用的代码主干，看issues里的对话，应该接近1.5版本了。如果你需要稳定版本，可以切换到该版本下：

git checkout 1.4.1

编译和安装：

qmake-qt4
make
sudo cp bin/phantomjs /usr/local/bin/

运行一下，看是否能得到截图：

DISPLAY=:0 phantomjs ~/phantomjs/examples/rasterize.js http://www.baidu.com screenshot.png

这时候还会有个问题，中文都显示乱码，因为ubuntu默认未安装中文字体。

可找合适的中文字体，上传到该目录下：

/usr/share/fonts/

然后再执行：

fc-cache

这样中文字体就生效了。