toozoofoo

optimizing for happiness

莲蓬网几个月前开始对用户收藏的网页进行截屏,并展示在链接左侧,在底层用得工具是wkhtmltoimage,原理其实就是模拟浏览器行为,渲染出网页后进行截屏。但是现在发现这个工具对于某些网站,截图之后的图片是一片空白,这个实在令人难以忍受。在一番研究之后才了解到,这样的网页一般是有图片的,而这些图片展示有两种情况:使用了一种叫做parallax的技术(例如这个:http://llidesign.co.uk/iconic-furniture/)图片使用了异步加载的方式这两种情况都是需要人用鼠标往下滚动页面时出发了一些js脚本,产生图片显示,我查下了wkhtmltoimag的各种参数,貌似都不支持。而我知道现在的一种叫做headless webkit的实现,它也是一种浏览器,只不过没有界面,暴露一些浏览器的api给开发使用。当然,它的出现得益于nodejs的诞生。这样的js库有很多,这里只列出一个PhantomJS,它的api里就有截屏的接口,网站中甚至提供了一个简单的例子:var page = require('webpage').create(); page.open('http://github.com/', function() { page.render('github.png'); phantom.exit(); });在python里调用PhantomJS的这个api,只需要写个js,然后通过Popen运行。但是问题在于由于网页的下载和渲染,包括截屏都是异步的,python程序里调用后,并没有等待截屏结束。在google之后,得到的解决,借助selenium:driver = webdriver.PhantomJS() # or add to your PATH driver.set_window_size(1024, 796) # optional driver.set_page_load_timeout(20) driver.get(url) driver.save_screenshot(target) # save a screenshot to disk driver.quit() 具体selenium在内部如何实现同步的,有兴趣可以看下源码。


刚刚