1. phantomjs介紹
基於Javascript驅動的命令行webkit引擎,輕量級,安裝簡單,開發快速,渲染速度較快,無界面的webkit瀏覽器。 phontomjs跟一般瀏覽器一樣可以加載網頁,但不同的是它不會把網頁顯示出來,在加載網頁后它會提供一系列的Javascript API給程式人員使用,包括DOM元件的控制﹑CSS的選擇器﹑JSON﹑HTML5的Canvas和SVG﹗你可能會問這有什么特別,首先由於它沒有顯 示,所以非常之快。另外由於有完整的DOM和CSS控制,你可以很方便地抄錄其他網頁的資料,包括圖片﹗舉例說你希望每日都把GOOGLE的首頁插圖抄下 來,你就可以簡單的寫一個程式,加載google.com后把特定的畫面大小和位置儲存成圖片,再用Cron等Scheduler定期執行,不用每天開啟 瀏覽器再屏幕截圖了。
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、在文件夾空白處-->右鍵-->在此處打開命令窗口
5、輸入如下代碼:
phantomjs snap.js http://hao123.com hao123.png
6、回車后得到如下運行狀態:
7、得到截圖