Showing posts with label Project. Show all posts
Showing posts with label Project. Show all posts

Wednesday, March 16, 2011

Introduction to Inspector

有时我们想要监视某个网页是否有更新, 但网站又没有提供RSS, 这时就只能定期去查看那个网页, 偶尔也会因此忘记. 这种枯燥、乏味的重复行为让人厌倦, 于是我实现了一个简单的小项目, 我把它叫做 Inspector. 输入你想要监视的网址, 选取你感兴趣的网页元素, 然后Inspector就会在有更新时通过Email通知你. It’s simple, huh?

下面是一些使用截图, 首先是选取网页元素:

Inspect

然后是Inspector发给你的通知邮件 (最好把邮件地址先加到联系人里, 一般来说第一次都会被判为垃圾邮件, 至少Gmail是这样):

Inspector Notification

网站只在Firefox、Chrome和Safari中测试过, 访问可能需要翻墙 (由于某种众所周知的原因, 你懂的). 目前项目代码已经托管在GitHub: https://github.com/xiaogaozi/inspector, 如果你有任何问题或者建议可以到 这个页面 提出.

接下来是一些实现这个项目过程中的技术吐槽, 不感兴趣的同学可以直奔 项目主站 围观.

选取网页元素这点是借鉴的Firebug, 同时借鉴的还有它的代码. 在使用JS绑定事件时遇到了 this 关键字引用错误问题, 最后在 “JavaScript: The Definitive Guide” 中找到了答案, 具体可参考书中17.1.5小节. 呵呵, JS基础没学好. “/inspect” 页面最下面的提示要感谢兰姐提醒用 iframe, 对于固定样式很有好处. 修正网页CSS、JS链接这个需要判断是否为绝对地址, 常规的也就是http或者https打头, 不过 The World Clock 网页的CSS引用很奇怪, 是 “//” 打头, 测试大猫的博客时也让我发现一个类似的bug. 像Facebook这样的通过代码动态加载CSS的也没办法, 还有如果是用 frameset 写的页面现在还暂时不支持.

页面抓取现在对于静态页面效果要好一点. 定位网页元素现在比较常用的有CSS selector和XPath, 前者我更熟一点, 不过Python标准库不支持, libxml2可以, 但它所需要的so库不能上传到GAE, 只能作罢, 而且它只能分析那些标准的XML, 遇到稍微不标准的就会出错, 这点和标准库一个德行. 但互联网上充斥着各种不标准, 这由不得开发者挑剔, 要对付它们, Beautiful Soup 是一个不错的选择. 但问题又来了, BS即不支持CSS selector, 也不支持XPath. 后来我找到一个日本人写的 BS扩展, 可以用上XPath. 至于CSS selector, 我也找到 一份Python实现, 需要结合Tidy来处理那些非标准页面, 不过我没试过.

能这么快完成, 也得益于GAE的便捷 (虽然前前后后花了有半个来月). 用户验证、Email服务、数据存储这些都能通过很简单的API搞定, 不过自带的Django模板引擎有点弱智, 一些高级语法支持不了.

页面风格抄的GitHub, 按钮是GitHub和Twitter的结合, 表格抄的GAE, About页面用AsciiDoc写的, 看起来还算凑合. 第一次用Closure Compiler, 第一次用CSSTidy, 压缩了确实不错.

最后, 如果你坚持看到这里的话, 感谢你的支持.

Tuesday, November 24, 2009

Yet Another Gmail Row Highlight 0.0.1 Released! 键盘流的Gmail利器

昨天花了点时间写了一个Greasemonkey脚本, 功能和上一篇介绍的Gmail - Add Row Highlight (以下简称GARH) 很像, 只不过GARH是当鼠标滑过时高亮, 而我的这个脚本是在使用键盘浏览邮件时高亮小箭头指示的那行. 说得有点复杂, 上图:

Yet Another Gmail Row Highlight

脚本主页是: http://userscripts.org/scripts/show/62644, 不过目前Chrome/Chromium用户还无法使用.

大家多多提意见, 提交bug和建议请到: http://code.google.com/p/fancyweb/issues/list

Thursday, November 12, 2009

SNS All in One 0.0.3 Released, 支持Jetpack 0.6

这个版本针对刚刚发布的Jetpack 0.6做了一点修改, 主要是因为Jetpack 0.6的API有点抽筋, 这个我会在下一篇文章中讲到. 此外还修复了一个豆瓣的链接bug.

由于Mozilla已经推出了官方的Jetpack扩展网站: Jetpack Gallery, 以前那个在Userscripts.org上的页面也就停止更新了, 全面转向新的页面: http://jetpackgallery.mozillalabs.com/jetpacks/80, 请以前安装了SNS All in One的各位先把以前的卸载了, 再到新的页面上安装. 卸载方法为: 打开"about:jetpack"页面, 在"Installed Features"标签里找到"SNS All in One", 点击"uninstall"即可. 然后升级到Jetpack 0.6, 到新的页面安装.

如果你是第一次使用SNS All in One, 推荐在安装后阅读"SNS All in One 用户指南".

更多版本信息, 请参阅"SNS All in One Release Notes".

Thursday, September 17, 2009

SNS All in One在Jetpack 0.5中失效

今天升级到了最新的Jetpack 0.5, 结果发现SNS All in One失效了, 侧边栏也不见了. 经过一番调查, 发现是Jetpack 0.5自身的问题, 并且也有人和我一样遇到了类似的问题, 只能等待Mozilla来解决了. 如果已经升级到0.5了, 卸载之后重新安装Jetpack 0.4即可正常使用.

Saturday, August 15, 2009

SNS All in One 0.0.2 Released

校内改名人人了, 以前的http://m.xiaonei.com/也用不了了, 这个版本把校内的网址改成了: http://m.renren.com/, 如果你以前安装的时候勾选了"Auto-update this feature", 那过一段时间Jetpack会自动更新的, 可以不用管. 或者可以到这里重新安装最新版本.

Friday, August 7, 2009

SNS All in One 0.0.1 Released

以前总在想, 能否像TwitterFox那样方便地更新我的校内, 查看校内好友的新鲜事和豆瓣的友邻广播呢? 我需要实现这样一种功能, 能够在我想看的时候很方便很快速地看到, 而其它时间则隐藏起来. 自从了解了Jetpack, 我就在思考着能否实现这个想法. 经过几天的编写, 就有了SNS All in One这个Jetpack扩展.

SNS All in One是一个Jetpack扩展, 主要使用Jetpack的slide bar (侧边栏) 特性, 现在实现的功能就像上面说的一样, 可以查看手机校内的所有内容, 以及豆瓣的友邻广播. 截图如下:

SNS All in One - 豆瓣
查看豆瓣友邻广播

SNS All in One - 校内
查看手机校内

功能很简单, 点击侧边栏的图标可以刷新页面. 由于侧边栏不能复制链接, 可以选择拖动链接到Firefox主窗口中打开. 不过需要注意下, 这个扩展只支持Firefox 3.5及以上版本.

欢迎提供各种反馈, 请将意见提交到Google Code或者Userscripts.org的Discussions页面上, 也可以给我发送邮件: gaochangjian[at]gmail[dot]com, Because it's your web.