一种使用文档对象模型的AJAX爬行方案

张雪松，王鸿磊

（1．徐州工业职业技术学院，江苏 徐州 221140；2.徐州市工业信息网络工程技术研究中心，江苏 徐州 221000）

一种使用文档对象模型的AJAX爬行方案

张雪松1，2，王鸿磊1，2

（1．徐州工业职业技术学院，江苏 徐州 221140；2.徐州市工业信息网络工程技术研究中心，江苏 徐州 221000）

许多WEB应用程序采用AJAX技术来增强用户体验。但是AJAX的一些特性使它在传统搜索引擎实施抓取操作时非常困难。如谷歌的AJAX爬行方案需要网站改变架构并添加额外的代码，因此只被谷歌支持。针对这种情况，提出了一种基于文档对象模型和广度优先爬行算法的AJAX爬行方案，它可以通过跟踪由AJAX事件引发的DOM树的变化，来建立AJAX WEB应用程序的状态转换图，进而生成原始AJAX WEB应用程序的静态镜像站点。实验证明，该AJAX爬行方案确实可以爬行AJAX应用程序。

AJAX爬行；文档对象模型；广度优先；算法

0 引言

目前AJAX（Asynchronous JavaScript and XML）技术在Web 2.0的庇护下已经获得了突出的位置[1]。应用AJAX的WEB应用程序是一种新型的高度互动和动态的WEB应用程序[2]。AJAX是Java-Script、文档对象模型（DOM）操纵和XMLHttpRequest对象的结合。谷歌邮件、雅虎邮件、谷歌地图是众所周知的AJAX应用程序，他们采用AJAX以实现增强用户体验的目的。在这些应用中，客户端代码在浏览器中运行，而并不总是刷新WEB页面，因此在很大程度上减少了服务器流量[3]。

尽管AJAX技术的使用对WEB应用程序的用户友好性和交互性有积极的影响，但是AJAX有很多特性使它非常难于被传统的搜索引擎所抓取。影响AJAX爬行的最主要因素有两个，一是AJAX技术严重依赖于JavaScript，而JavaScript是一种客户端脚本语言，它运行在浏览器（如IE，火狐，Chrome，Opera等）之上，而且不同的浏览器支持不同的特性和功能；二是一个AJAX WEB应用程序总是处于一个给定的URL，尽管通过用户调用UI事件，该应用程序能够从一个状态变化到另一个状态，但是它的URL始终不变。

谷歌的AJAX爬行方案通过实施“hashbang”概念来解决爬行AJAX的问题。但是它更加复杂，需要额外的编码，而且目前还不是每个搜索引擎都支持该方案，因此AJAX对于搜索引擎优化（SEO）仍然是一种挑战[4]。

本文提出了一个基于DOM和广度优先AJAX爬行算法的AJAX爬行方案。方案中的AJAX爬行控制器采用一组能够触发AJAX事件的DOM元素，以调用相应的JavaScript函数。随着对AJAX事件的调用，用户界面上DOM树的结构也会改变，因为DOM树的变化代表状态的改变，所以从DOM树的结构变化，可以建立一个状态转换图（STG）。该STG包含一组状态和它们之间可能的转换，它随后被用来生成原始AJAX WEB应用程序的一个静态镜像站点[1]。在本文的方案中，AJAX爬行控制器必须执行JavaScript代码，这与谷歌的AJAX爬行方案有些不同。

1 AJAX爬行方案

本文的目的是通过爬行WEB应用程序中的AJAX内容，改善搜索引擎的搜索结果。AJAX爬行方案的架构设计如图1所示（包含的组件和技术将在下面进行说明）。

1.1 JavaScript安全检测器

爬行AJAX是基于对AJAX WEB站点中HTML和JavaScript代码的静态分析。为了使Java-Script代码可执行，本文提出了一个爬行AJAX的动态方法，它需要执行JavaScript代码。这点不同于谷歌的AJAX爬行方案。考虑到JavaScript代码可能包括一些恶意代码，因此需要在AJAX WEB站点和AJAX爬行控制器之间安装一个JavaScript安全检测器，以保证AJAX爬行控制器的安全运行。

图1 AJAX爬行方案的架构

JavaScript安全检测器可以采用JSA（Rational AppScan标准V8.0发起的一项AppScan扩展）来执行JavaScript的静态分析，以检测常见的客户端安全漏洞。

1.2 文档对象模型（DOM）

文档对象模型（DOM）是一个跨平台、独立于语言的公约，它可以表示并交互HTML、XHTML和XML文档中的对象。DOM技术使用户页面可以动态地显示或隐藏元素，改变元素属性，增加元素等，它大大增强了页面的交互性。当一个HTML页面在浏览器中呈现时，浏览器解析标记（例如HTML），从WEB服务器下载到内存的DOM中。DOM被用来构建在浏览器窗口中显示页面的额外内部结构。每个文档的节点以树形结构进行组织，称为DOM树。DOM树的最顶层节点是文档对象，每个节点拥有零个或多个子节点。

DOM是JavaScript到浏览器状态和它所包含的HTML页面的方式。在AJAX应用程序中状态的改变是动态的，通过运行时DOM树的变化表示出来。也就是说，搜索引擎可以利用AJAX应用程序运行时的动态DOM树，来爬行和索引AJAX应用程序。

1.3 静态转换图（STG）

一个AJAX应用程序不只是一个简单的通过一个URL定义的页面，它还是一系列的状态和转换，这是传统页面和AJAX页面的主要区别。可以通过记录DOM中的状态和它们之间的转换，来对AJAX中用户界面状态的变化进行建模，从而相应地模拟AJAX页面。所建立的状态转移图（STG）将被用来派生一些静态页面作为搜索结果[5]。

为此，本文定义的状态转换图（STG）为一个AJAX应用程序A的状态转换图（STG）是一个有向图：DG〈V，VR〉，其中：

V是一个顶点集V={v}，表示状态。每个v∈V表示一个A运行时的状态。

VR是顶点之间边的集合，VR={〈v，w〉|v，w∈V}，其中〈v，w〉代表一个从v顶点状态到w顶点状态的转换。P（v，w）被定义为一个特定的连接两个现有顶点状态的转换，当且仅当顶点状态w通过从顶点状态v执行P被达到。

可以通过调用方法addState（s），添加一个新的顶点状态s到STG的V中；同时通过调用方法addTransition（t），添加一个新的转换边t到STG的VR中。顶点状态s是一个类State的对象实例，转换边t是一个类Transition的对象实例。

本文的状态转换图类与文献[6]的状态转换图类似，但有几个主要函数的定义是不同的。

1.4 AJAX爬行控制器

AJAX爬行控制器负责访问AJAX应用程序的DOM，分析并检测状态的变化。它还控制着搜索引擎机器人的行动，当DOM发生相关变化时，负责更新STG。本文的AJAX爬行控制器基于广度优先AJAX爬行算法。图2说明了广度优先AJAX爬行算法的设计。

AJAX爬行的第一步是创建一个空的STG和爬行状态队列，启动浏览器（行2），并按照给定的URL从服务器获取WEB页面（行3）。下一步是建立AJAX应用程序的初始状态，在此可以使用当前DOM并设置depth为“0”，此外，还应添加初始状态到爬行状态队列中（行5）。

算法的主要部分执行一个对AJAX应用程序状态的广度优先爬行（行6～行29）。爬行的过程如下：

首先从爬行状态队列中删除一个元素（行7），并将其加载到浏览器作为当前状态（行8）。然后，提取所有DOM树中能够触发事件的DOM节点（行11）。事件模式为JavaScript模式。之后，顺序触发提取节点序列中每个节点的绑定事件（行12）。如果一个触发事件生成了一个XHR调用，就抽出生成的指向背景深网资源的超链接，等待和接收从WEB服务器的响应（行14～17）。

图2 广度优先AJAX爬行算法

当一个节点事件被调用时，必须将生成的浏览器DOM树与在此之前的DOM树进行比较，以确定状态是否发生改变。为此，两个DOM树间的编辑距离使用Levenshtein[7]方法进行计算（行18）。两个DOM树使用的相似度阈值τ（0.0-1.0）可以由开发人员定义[1]。阈值为0意味着两个DOM状态是克隆的，如果他们有完全相同的结构和内容，任何变化均被视为状态改变。如果一个根据相似性度量和STG检测到的变化，不包含当前DOM表示的状态（行19），一个新的状态将被创建（行20）。新的状态被创建之后，它将被添加到STG（行21），同时也被添加到爬行状态队列中（行22）。此外，还应该创建从先前状态到新状态的转换（行23），并将它添加到STG（行24）。为了生成一个STG，需要触发每个状态的DOM节点的所有绑定JavaScript事件，但在事件被触发后，AJAX应用程序通常会进入一个新状态。因此要依次触发同一状态的所有事件，必须把AJAX应用程序恢复到先前的状态，这是实现状态的切换（行27）。

当前状态的所有节点事件被处理完之后，需要判断爬行状态队列是否为空（行6）。如果非空并且爬行状态的深度还没有达到预设的最大值（行9），上面的遍历过程将重复进行；否则，爬行过程结束，STG将被生成。

爬行过程完成后，控制器将调用索引页生成过程。

1.5 索引页生成器

在AJAX爬行控制器完成爬行AJAX操作之后，STG已经被建立完成时，索引页生成器可以通过使用STG生成一些静态文件，如图1所示。索引页生成器主要负责转换每个STG中的DOM对象为相应的HTML字符串，并将其保存在文件系统的一个专用目录中。每个生成的静态文件都代表了用户在浏览器中所看到的AJAX应用程序的风格、结构和内容，完全对应于爬行时的特定状态。[1]

2 AJAX爬行试验和结果

为了验证本文所提出的AJAX爬行方案的有效性，课题组开发了一个基于Java语言DOM的AJAX爬行系统。我们称之为“爬行AJAX试验”，简称“CAT”并把它与传统的网络爬虫进行了试验对比。

我们选择了一个简单的国外蜘蛛爬行程序“CsSpider”来进行对比。CAT的最大状态深度设置为“3”，CsSpider的最大页面深度也设置为“3”。用来运行两个爬行器的试验笔记本电脑的配置为英特尔酷睿2双核CPU P8600（2.40 GHz），1GB RAM和Windows 7操作系统。为了获得一个令人信服的试验结果，我们又设计了一个AJAX WEB站点作为试验环境，模仿[1]中的单一页面AJAX站点。

试验结果如表1所示。

表1 测试结果比较

通过表1数据的对比可以看出，由于CsSpider是一个静态爬行器，只能提取静态超链接，所以CAT检测到的服务器资源链接数明显高于CsSpider。由此可以证明，本文提出的基于DOM的AJAX爬行方案确实可以爬行AJAX应用程序。但是因为CAT在爬行的过程中需要执行JavaScript代码，所以它的执行时间比CsSpider长，效率比CsSpider低。在未来的工作中，我们计划通过改善AJAX爬行算法，部分补偿由于执行JavaScript代码所造成的效率损失。

3 结语

爬行AJAX是一个高度动态的、交互式的WEB应用程序转换到一个静态的镜像站点的过程。本文提出一种基于广度优先AJAX爬行算法的AJAX爬行器。它对于提高搜索引擎的能力，扩展搜索结果有重要意义。试验表明，本文提出的AJAX爬行方案具有可行性，能够通过DOM元素调用相应的JavaScript函数，生成状态转换图，进而生成原始AJAX应用程序的一个静态镜像站点，但是本方案的爬行效率还需要改进。因此，今后的研究工作应致力于改善AJAX爬行算法和研究更多特殊的AJAX WEB站点，以提高AJAX爬行器和搜索引擎的执行能力。

［1］Ali Mesbah,Engin Bozdag.Crawling AJAX by Inferring User Interface State Changes［C］.Eighth International Conference on Web Engineering,2008.

［2］Nick Matthijssen,Andy Zaidman.FireDetective:Understanding Ajax Client/Server Interactions［C］.33rd International Conference on Software Engineering,2011.

［3］Cristian Duda,Gianni Frey.AJAX Crawl:Making AJAX Applications Searchable［C］.IEEE International Conference on DataEngineering,2009.

［4］S.S.Chawathe,A.Rajaraman.Change detection in hierarchically structured information［C］.ACM SIGMOD international conference on Management of data,1996.

［5］A.Mesbah,A.van Deursen.Migrating multi-page web applications to single-page Ajax interfaces［C］.11th European Conference on Software Maintenance and Reengineering,2007.

［6］郭浩，陆余良.一种基于状态转换图的Ajax爬行算法［J］.计算机应用研究，2009，26（11）.

［7］V.L.Levenshtein.Binary codes capable of correcting deletions,insertions,and reversals［C］.Cybernetics and Control Theory,1996.

An AJAX Crawling Scheme Adopting Document Object Model

ZHANG Xue-song1,2,WANG Hong-lei1,2
(1.Xuzhou College of Industrial Technology,Jiangsu Xuzhou 221140,China;2.Xuzhou engineering research center for information network of industrial,Jiangsu Xuzhou 221000, China)

Many webapplications employ AJAXtoenhancetheir user experience.But many properties of AJAX can maketraditional search engines crawl webapplications hardly.Google’s AJAX crawling scheme was currently supported only by Google,because it suggests webmasters changetheir website architectures and add additional code.In viewofthis,the paper presented an AJAX crawling scheme based on document object model and breadth-first crawling algorithm.It can establish astatetransition graph of an AJAX webapplication,throughtrackingthe changes of the DOMtree.Then it builds astatic mirror site of the original AJAX webapplication.Experimental results showthatthe AJAX crawling scheme can really crawl Ajax application.

Ajax crawling;Document object model;Breadth-first;Algorithm

TP31

A

1673-2022（2014）02-0044-04

2014－03－26

2013年徐州市科技发展基金计划（XF13C035）；2012年徐州工业职业技术学院科研课题（XGY201213）

张雪松(1978-)，女，副教授，硕士，主要从事计算机软件技术研究；王鸿磊(1979-)，男，副教授，硕士，主要从事物联网、无线通信技术研究。