JavaScript解析:让搜索引擎看到更真实的网页

标签: 搜索技术 未分类 JavaScript 网页解析 | 发表时间:2012-07-03 02:39 | 作者:editor
分享到:
出处:http://stblog.baidu-tech.com

长期以来,站长们选择使用JavaScript来实现网页的动态行为,这样做的原因是多种多样的,如加快页面的响应速度、降低网站流量、隐藏链接或者嵌入广告等。由于早期的搜索引擎没有相应的处理能力,导致在索引这类网页上往往出现问题,可能无法收录有价值的资源,也可能出现作弊。

引入JavaScript解析的目的,正是为了解决上述两方面的问题,其结果也就是使搜索引擎可以更为清晰的了解用户实际打开该网页时看到的效果。比如有些网站会将用户评论、评分等信息从网页HTML中抽离,利用JavaScript甚至AJAX等方法在页面被打开的时候动态显示出来,早期的搜索引擎此时能处理到的页面内容就是缺失的,由此会进一步影响对该页面索引价值的判断。

要引入JavaScript解析,需要考虑本身的设计与实现、解析速度和对系统其它方面影响等因素,本文通过一些典型的案例来分析如何设计并实现一套网页JavaScript解析系统,并简要介绍这样的系统对于搜索引擎其它部分的作用和影响。

一、发现页面链接

一般来说,页面链接都是以HTML中的A标签形式存在,链接URL标记在href属性中,但实际存在着一些网站会选择更为“动态”的方式,较为常见的方式有两种:一种是动态写入或调整A标签,另一种是在用户点击的时候触发事件改变默认的链接打开方式。

1. 动态写入或调整链接标签

抽象的说,网页要实现这样的效果,乃至后文描述的其它效果,与把大象放入冰箱极为类似,分为三步:找到要写入/修改的目标(找到大象),准备好要写入/修改的内容(打开冰箱门),执行写入/修改(把它放进去)。

这三步操作映射到JavaScript上,就是先后调用三组标准的浏览器功能函数:页面元素定位、数据准备以及页面修改。那么,JavaScript解析的工作就是同样提供出这样的函数,随着被站长的JavaScript代码调用自然的发现相应的内容和行为。

分析至此,所需实现的函数也就基本确定了,其中较为简单的包括:

    • document.getElementById // 定位
    • document.getElementsByTagName // 定位
    • document.getElementsByClassName // 定位
    • node.[firstChild/nextSibling/previousSibling/parentNode] // 定位
    • document.[createElement/createTextNode] // 创建链接
    • node.[appendChild/insertBefore/innerHTML=?] // 写入内容
    • element.getAttribute, element.setAttribute // 设置属性
    • element.href = ? // 设置属性

至于要写入的内容,可能是以数组等形式保存在JavaScript种,也可能是使用AJAX动态加载。前者属于JavaScript语言的内置功能,此处不再复述;后者是一个单独的话题,会在后文专门讨论。

2. 点击时触发事件改变默认的链接打开方式

页面这样做的原因不一,有的是为了隐藏链接,有的是为了实现弹出窗口,有的则是为了程序拼接URL,还有的是做检查看是否应该打开链接等等。但所有这些原因都对应着同样的实现方法:添加click事件。

添加click事件的方法有三种:

    • 将A标签的href属性设置为“javascript:func(…)”的形式
    • 设置A标签的onclick属性,设置为onclick=”js_code” 的形式
    • 调用事件绑定函数,如my_link_node.addEventListener(‘click’, func, false)

支持这三种方法本身是较为简单的,需要注意的地方在于如何触发这样的click事件,以及如何在触发之后截获目的URL。

对于触发事件而言,首先需要收集到所有可能的click事件,而后再依次触发。但对于每一个要触发的click而言,实际触发之前必须先检查其是否还存在,这是由于在其之前的click事件很可能已经把当前这个click删除掉了。

要做到截获URL,首先要实现相关的页面跳转函数,既location.href = ?,window.open等。而后通过设置一系列标志,将本次点击和页面跳转关连起来,如此也就得到了目标URL。

二、动态页面内容

页面动态内容是一种提升页面加载速度、增强网站技术灵活性的手段,可以将那些会改变的内容(如评论、评分等)抽离,使页面分为静态和动态两部分:静态内容可以使用缓存等方法加快页面显示速度、降低网站流量;动态内容则有格式简单好生成的优势,同时也能节省流量。

另一方面,动态内容也是加载广告和内容作弊的重要方法,最常见的就是写入iframe,这对于早期搜索引擎而言有极大的隐蔽性。

在技术层次上,动态页面内容所需要的工作与上一节“动态写入或调整A标签”在很大程度上是相同的,这里需要增加的是经典的“document.write”方法。

该方法是最早的JavaScript功能之一,用于向页面直接写入一段HTML代码,至今仍在广泛使用。对于该方法,早期的搜索引擎都有所支持,但方法基本限于字符匹配,仅能支持最直接的写入一个JavaScript字符串的方式,对于稍微复杂的文本拼接显得无能为力。但对于JavaScript解析而言,这段代码终究是要符合语言规范的,因此就能做到完整支持,处理文本拼接、条件判断和混淆代码等各种情况。

这里还需要讨论的一点是嵌套的document.write,也就是通过document.write写入一个SCRIPT标签,该标签内部是另一段document.write。这类问题在跳转作弊页面中屡见不鲜,对其支持就不只需要JavaScript解析,还需要HTML解析器能够支持处理嵌套的HTML写入功能,这里就不加以分析了。

通过上述方法,无论是网页的主体信息,还是广告或其它辅助信息,都会被暴露出来,从而更好的理解站长意图。

三、网页跳转

网页跳转在有些情况下是达到页面效果的必要选择,但同样会用于作弊。在技术上,多以下面两种方式出现:

    • 直接调用页面跳转函数
    • 针对搜索引擎的UA、referer等调用页面跳转函数

这里要实现识别,最核心的就是实现页面跳转函数:location对象。由于这是技术上唯一的JavaScript跳转函数,所以无论页面的JavaScript如何撰写如何混淆,最终都会调用该函数。因此,尽管不同页面的跳转代码看上去五花八门,但识别出来却是简单的。

四、关于AJAX

AJAX是极为常见的网页技术,根本上说就是在网页显示期间,动态的从互联网上获取一段数据(可能是HTML也可能是其它),经过处理后加以显示。

对于该技术,根本的工作并不在于XMLHttpRequest对象的实现,而是在于对搜索引擎爬虫架构的影响。众所周知,爬虫抓取页面,遍历其链接,再依次抓取的形式设计的,其工作主要集中在调度和控制抓取压力上,抓取器本身较为简单,通常不具备抓取后即时执行JavaScript并抓取AJAX数据的能力,因此需要技术升级方可支持AJAX。

对抓取器的分析超出了本文的范围,有兴趣的读者可以查看其它相关文献。

总结

通过前面的案例分析,我们总结出了实现JavaScript解析所需要的基本工作,此外再增加一定的基础性建设就能构成一套较为完整的系统了。这里我们再次整理一下,将其分为三个部分:

1.  在HTML解析器中嵌入JavaScript语言引擎,语言引擎可以选择V8、SpiderMonkey等成熟的开源方案。

2.  实现所需的功能函数,具体可参考W3C的相关HTML和DOM规范。

3.  作为一个直接推论,需要收录所谓的.js文件,这是JavaScript解析所需要“解析”的源代码。

本文中介绍的功能仅是一部分较为常见的JavaScript功能,要让搜素引擎真正看到实际的页面还需要进一步实现其它需要的功能,此外还需要配合对HTML、CSS、图片等资源的支持。

最后,对于希望使用JavaScript的站长来说,本文给出如下建议:

1.  不要使用过于复杂的JavaScript技术,这不利于搜索引擎的收录

2.  不要阻止对.js文件的收录,否则会限制JavaScript解析的能力

3.  合理的划分站点的静态部分和动态部分

by Lileding

相关 [javascript 解析 搜索引擎] 推荐:

JavaScript解析:让搜索引擎看到更真实的网页

- - 搜索研发部官方博客
长期以来,站长们选择使用JavaScript来实现网页的动态行为,这样做的原因是多种多样的,如加快页面的响应速度、降低网站流量、隐藏链接或者嵌入广告等. 由于早期的搜索引擎没有相应的处理能力,导致在索引这类网页上往往出现问题,可能无法收录有价值的资源,也可能出现作弊. 引入JavaScript解析的目的,正是为了解决上述两方面的问题,其结果也就是使搜索引擎可以更为清晰的了解用户实际打开该网页时看到的效果.

搜索引擎链接算法之:HITS算法解析

- - CSDN博客推荐文章
本文节选自《 这就是搜索引擎:核心技术详解》第六章.       HITS算法也是链接分析中非常基础且重要的算法,目前已被Teoma搜索引擎(www.teoma.com)作为链接分析算法在实际中使用. 6.4.1 Hub页面与Authority页面.      Hub页面和Authority页面是HITS算法最基本的两个定义.

javascript之XML DOM的解析

- - ITeye博客
javascript之XML DOM的解析. <province name="吉林省">. <city>长春</city>. <city>吉林市</city>. <city>四平</city>. <city>松原</city>.

人眼启发视觉搜索引擎

- feng823 - Solidot
Google上周宣布将支持声音和图片进行搜索,但一家创业公司在图像搜索方面走在了Google前面. 源自伦敦帝国学院研究项目的创业公司Cortexica,开发出视觉搜索工具,通过手机拍摄产品照片,它会自动呈现价格信息. Cortexica已经发布了一个用于比较酒价格的工具WINEfindr. Cortexica的视觉搜索技术是受到了人眼视觉系统的启发,它能识别出一个目标的关键特征,不受方位、大小、光线亮暗的影响.

比较好的学术搜索引擎

- hfut_chen - C++博客-首页原创精华区
     摘要: 1、http://scholar.google.com/. Google学术搜索滤掉了普通搜索结果中大量的垃圾信息,排列出文章的不同版本以及被其它文章的引用次数. 略显不足的是,它搜索出来的结果没有按照权威度(譬如影响因子、引用次数)依次排列,在中国搜索出来的,前几页可能大部分为中文的一些期刊的文章.

uSniff:BT种子搜索引擎

- leqoqo - 软件志
一、uSniff相关信息: 1、官方主页:http://www.usniff.com/ 2、简介:uSniff是一个BT种子搜索引擎,简单、易用、实时是其最大的优点,其搜索引擎数据库包含了17个知名种子站点的种子信息,目的是想发展成为世界上最大的BT种子搜索引擎,而且对于每个种子,该搜索引擎都会进行安全认证,以保证用户的正常使用.

Mr.Icons:图标icon搜索引擎

- 壮壮爱 - 够趣堂
之前Anliu在如何更换更好的icon文章里面推荐了4个icon搜索引擎,目前部分已经不复存在. 不过Mr.Icons倒是又一个不错的选择,可以搜索图标icon进行下载,有PNG、ico格式以及不同大小提供下载. Mr.Icons还提供图标icon集打包下载,比如动物图标等. 和之前的介绍几款搜索引擎一样,依然不支持中文.

Blekko 对搜索引擎的新探索

- thinkingit - 知乎的博客
Blekko 这款搜索产品做的如何. 从目前我的使用过程来看,Blekko还是很让人激动的. 在谈Blekko之前就要先问:为何在搜索这个看似已经垄断的行业还会有人想去分一杯羹,这些小团队能与Google或微软这样的巨头抗衡吗. 比如之前的Powerset,后来的Cuil,和现在的Blekko. 在Google之前Yahoo是靠人工收录网页,Google的算法和蜘蛛革了搜索的命,一直垄断搜索业十余年,而现在随着WEB 2.0的发展,让人又看到了搜索业革命的火种,可以说Blekko就是这样的一个产品.

迅搜全文搜索引擎 XunSearch

- Le - 开源中国社区最新软件
迅搜(xunsearch)是采用 C/C++ 基于 xapian 和 scws 开发的全文搜索引擎解决方案,提供 PHP 语言的开发接口. 支持海量数据高速检索,功能强大,简单易用. 本项目旨在帮助一般开发者针对既有的海量数据,快速而方便地建立自己的全文搜索引擎. 全文检索可以帮助您降低服务器搜索负荷、极大程度的提高搜索速度和用户体验.

搜索引擎的特殊用法

- iVane - 崔凯,前端开发
下周组内分享要讨论“工具”,介绍几个搜索引擎的特殊用法,凑凑数:. 通配符,这么搜可以得到“崔凯前端开发”,也能得到“崔凯大连开发” 崔凯*开发. 用于搜索查询词出现在URL中的页面. 由于关键词出现在URL中对排名有一定影响,因此使用inurl:搜索也是定位竞争对手的一种方式. 该指令搜索结果返回的是页面title中包含关键词的页面.