注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

淘尽网 官方博客

淘尽网http://www.tao3w.com做最好的比价网站

 
 
 

日志

 
 
关于我

淘尽网 http://www.tao3w.com 做最好的比价网站,做最好的数据抓取专家。

网易考拉推荐

使用webkit实现网页缩略图  

2012-08-24 09:24:26|  分类: python |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

blade之前提起用webkit2png进行网页中广告位的截图,但是之后遇到了些问题。今天有时间,就折腾了一下。


https://github.com/AdamN/python-webkit2png/上Clone下代码,扫了一眼,不是很多,使用Qt4实现的,可是杯具的是,当年学习的Qt4的都忘干净了。。。

实现方案
大致使用了一下webkit2png,发现有个问题,首先是不支持flash页面,也不能抓取全部网页。
1. flash支持
不断的google,发现只要设置QWebPage的一个属性就可以了,QWebSettings::PluginsEnabled。
查看webkit2png,发现其实本身是支持这么一个选项的 -F plugins,就设置了plugins这个属性。
2. 显示全部网页
这个问题查了好长时间,最后发现换了另外一个工具cutycapt竟然能够抓取全部网页。问题在什么地方呢?
webkit2png不能抓取全部网页,但是cutycapt能够抓取全部网页,两者都是使用的Webkit,那么应该只是API设置上的不同。
webkit2png使用setViewportSize()和setContentSize()使用这两个API来设置网页内容大小和显示部分的大小,但是webkit2png中用于网页显示的View寄生在Window上,本身Window大小有限无法放下全部网页,那么无论怎么调整大小都不可能抓取到全部网页。
cutycapt直接使用view进行显示,没有寄生在Window上,所以得到了全部网页。

==> webkit2png的window主要是用在geometry参数,用来调整显示的大小。

blade他们的需求是把网页中指定位置指定大小的部分抓取下来保存为图片,要实现这个需求,有两个思路:
1. 让浏览器焦点设置到具体的位置,直接抓图。
2. 抓下全图,使用工具裁剪出需要的部分。

分析方案1发现浏览器焦点设置,当前的这些开源实现,无论是webkit2png,还是cutycapt都没有实现,差了一下QT的文档,发现这么一个接口:
void QWebPage::scrollRequested ( int dx, int dy, const QRect & rectToScroll )   [signal]
发送一个信号控制滚轮到指定的位置,设置相应的slot函数,进行处理。考虑到自己现在的Qt水平,这个方案还是暂缓一下;-)

方案1暂缓就使用方案2,虽然有些搓,需要2步2个工具完成,但是可以忍:
使用cutycapt将整个网页抓取下来【可以使用去掉window的webkit2png实现】,然后使用convert命令,指定裁剪的部分在图片的位置以及其大小。

网页快照抓取
cutycapt命令使用:
--url=xxx指定需要生成缩略图的url
--out=xxx指定生成的缩略图路径
--javascript=on允许页面中的javascript运行
--plugins=on允许webkit的插件运行【flash支持需要设置这个选项
cutycapt --javascript=on --plugins=on --url=http://www.xyz.com --out=xyz.png

图片裁剪
convert裁剪图片的命令格式如下:
使用crop选项,进行图片裁剪,也可以直接使用mogrify。
convert -crop {Width}x{Height}+{X}+{Y} old-img.png new-img.png
会把old-img.png中位置从{X,Y}开始的大小为{Width,Height}的图片裁剪出来,并保存到new-img.png中。

实例
抓取sina首页上的百事可乐flash广告缩略图:
cutycapt --javascript=on --plugins=on --url=http://www.sina.com.cn --out=/home/wangyao/Desktop/sina.png
convert -crop 270x228+264+95 /home/wangyao/Desktop/sina.png /home/wangyao/Desktop/sina-ad.png


参考:
  评论这张
 
阅读(705)| 评论(0)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017