Windows中Phantomjs + Casperjs安裝使用方法

安裝 Phantomjs + Casperjs

Casperjs是用JavaScript編寫的導航測試指令碼和開發工具，這篇文章主要講解Casperjs在windows下的安裝和使用，如果你剛剛聽說Casperjs，請到 CasperJS 介紹 章節瞭解Casperjs的功能和作用，然後再回來這裡學習CasperJS的安裝。

CasperJS的使用是基於PhantomJS的，所以在安裝CasperJS之前要先安裝PhantomJS，請到這裡下載PhantomJS。在windows下安裝請下載windows版本。

第一步：下載了PhantomJS後，把壓縮包裡的檔案夾解壓到D盤，重新命名檔案夾為phantomjs，然後在windows中添加環境變數;D:＼phantomjs到Path中。在這裡先不用關心phantomjs檔案夾下的內容。

第二步：接下來我們就要下載CasperJS了，點擊這裡進行下載，在這裡我下載的是version is 1.1-beta3版本。

第三步：下載CasperJS，同樣把壓縮包裡的檔案夾解壓到D盤，重新命名檔案夾為casperjs，然後在windows中添加環境變數;D:＼casperjs＼bin到Path中。

第四步：把在運行中運行cmd命令開啟控制台，運行命令>casperjs –version，如果可以列印出版本號碼，恭喜你，CasperJS安裝成功。

PhantomJS 實現網站截圖

2. phantomjs應用情境

web迴歸測試
網頁截圖,png,pdf
網路狀況監控

3. phantomjs網頁截圖

1、到這裡下載phantomjs的Windows版本：

http://phantomjs.org/download.html

2、下載後解壓，得到以下檔案：

3、右鍵->建立一個檔案，命名為snap.js，裡面輸入如下內容：

 

代碼如下

複製代碼

var page = new WebPage(), address, output, size; if (phantom.args.length < 2 || phantom.args.length > 3) { console.log('Usage: rasterize.js URL filename'); phantom.exit(); } else { address = phantom.args[0]; output = phantom.args[1]; page.viewportSize = { width: 600, height: 600 }; page.open(address, function (status) { if (status !== 'success') { console.log('Unable to load the address!'); } else { window.setTimeout(function () { page.render(output); phantom.exit(); }, 200); } }); }

 

4、在開始菜單-->搜尋-->輸入CMD，開啟命令列模式：

5、定位到你的phantomjs目錄，輸入如下代碼，斷行符號後得到如下運行狀態：

phantomjs snap.js http://www.google.com.sg google.png

 

6、得到截圖

中文網站截圖亂碼，安裝字型解決

用phantomjs去截取中文頁面的網站可能會出現亂碼的情況，也就是截圖中中文的位置全是方框。
解決辦法就是安裝字型。
在centos中執行：yum install bitmap-fonts bitmap-fonts-cjk
在ubuntu中執行：sudo apt-get install xfonts-wqy
這樣再去截圖中文的頁面就不會出現一堆的方框了。