webshot一款網頁快照工具

webshot

https://github.com/brenden/node-webshothtml

Webshot provides a simple API for taking webpage screenshots. The module is a light wrapper around PhantomJS, which utilizes WebKit to perform the page rendering.node

 

例子

A simple url example:git

var webshot = require('webshot'); webshot('google.com', 'google.png', function(err) { // screenshot now saved to google.png });

An html example:github

var webshot = require('webshot'); webshot('<html><body>Hello World</body></html>', 'hello_world.png', {siteType:'html'}, function(err) { // screenshot now saved to hello_world.png });

Alternately, the screenshot can be streamed back to the caller:web

var webshot = require('webshot'); var fs = require('fs'); var renderStream = webshot('google.com'); var file = fs.createWriteStream('google.png', {encoding: 'binary'}); renderStream.on('data', function(data) { file.write(data.toString('binary'), 'binary'); });

An example showing how to take a screenshot of a site's mobile version:app

var webshot = require('webshot'); var options = { screenSize: { width: 320 , height: 480 } , shotSize: { width: 320 , height: 'all' } , userAgent: 'Mozilla/5.0 (iPhone; U; CPU iPhone OS 3_2 like Mac OS X; en-us)' + ' AppleWebKit/531.21.20 (KHTML, like Gecko) Mobile/7B298g' }; webshot('flickr.com', 'flickr.jpeg', options, function(err) { // screenshot now saved to flickr.jpeg });

 

做用

給網頁拍照, 生成網頁照片圖, 而後使用圖形化比對工具檢測圖形變化, 進而檢測頁面變化。ide

用於圖形並茂的方式, 給網頁作介紹, 給用戶更好的按照圖形的感受,記憶網站的使用場景。工具

例如, 用戶看到網頁截圖中有一個搜索框, 就知道是搜索引擎。網站

相關文章
相關標籤/搜索