（系统分析与集成专业论文）ajax技术在webgis中的应用.pdf

i 华华 中中 科科 技技 大大 学学 硕硕 士士 学学 位位 论论 文文 摘摘 要要 gis 技术与 web 技术的结合，推动了 webgis 的发展，实现了地理空间数据的 统一管理与信息共享，并加快了 gis 产业化和大众化。webgis 己经成为 gis 领域 的一个重要的研究方向。 但是当前的 webgis 系统普遍存在数据可重用性差、客户端通用性差、对平台 的依赖性强、开发复杂度高等问题，需要引入新的技术来进行改进。而 google maps 的成功无疑为 webgis 提供了一种新的设计思路和设计模式。 本文重点介绍了 ajax 技术，详细说明了 ajax 的异步通讯层的工作方式和工 作原理，对 ajax 应用程序中的异步通信模式和传统 web 应用程序中的通信模式的 工作方式进行了比较，指出了异步通信模式的优点，同时指出了 ajax 技术的优缺 点。 再通过对一款 webgis 开发平台arcims 的介绍与分析， 深入探讨了 arcims 的通信机制。 在此理论基础上，从几个方面分析了将 ajax 技术引入 webgis 的可能性，并 提出了一些需要注意的问题。然后结合 ajax 技术，分别从表示层（其中详细介绍 了地图拖放效果的实现） 、 应用逻辑层和数据库层设计 webgis 系统， 实现了 webgis 的客户端和服务器之间的异步通讯，完成了一个简单的 webgis 系统，经过测试达 到预期效果。 最后对自己的系统做出了总结，提出了系统需要改进的地方，并对 ajax 技术 在 webgis 发展前景作了展望。 关键词：关键词：ajax webgis arcims ii 华华 中中 科科 技技 大大 学学 硕硕 士士 学学 位位 论论 文文 abstract gis and web promote the development of the webgis, and make the unification of geospatial data management and information sharing come true and accelerated industrialization and popularization of gis. webgis has become an important research direction in the field of gis. but the webgis system today has poor data reusability, poor client commonality on the platform-dependent, and high complexity in the development, we need to introduce new technology to make improvements. the success of google maps for webgis undoubtedly provides a new design ideas and design patterns. the thesis focused on the ajax technology, and described the asynchronous communication layer, working methods and working principle of ajax. the asynchronous communication model of ajax applications and modes of communication model of traditional web applications were compared. the thesis pointed out the advantages of asynchronous communication model, at the same time pointed out both the advantages and disadvantages of ajax technology. then through the introduction and analysis of a webgis development platform - arcims, studied more about arcims communication mechanism. on this basis, the thesis analyzed the ajax technology into the possibility of webgis, and some issues need to pay attention to was proposed. then, from the presentation layer (which detailed the realization of drag-drop effect of the map), the application logic layer and database layer, combining ajax technology, this thesis implemented asynchronous communication between client and server, completed a simple webgis system, and tested to achieve the desired result. finally, i made a summary of the system, and proposed some points need to improve. at last, ajax technology in webgis development prospects are described. keywords: ajax webgis arcims 独创性声明独创性声明 本人声明所呈交的学位论文是我个人在导师指导下进行的研究工作及取得 的研究成果。尽我所知，除文中已经标明引用的内容外，本论文不包含任何其他 个人或集体已经发表或撰写过的研究成果。对本文的研究做出贡献的个人和集 体， 均已在文中以明确方式标明。 本人完全意识到本声明的法律结果由本人承担。 学位论文作者签名： 日期： 年 月 日 学位论文版权使用授权书学位论文版权使用授权书 本学位论文作者完全了解学校有关保留、使用学位论文的规定，即：学校有权 保留并向国家有关部门或机构送交论文的复印件和电子版，允许论文被查阅和借阅。 本人授权华中科技大学可以将本学位论文的全部或部分内容编入有关数据库进行检 索，可以采用影印、缩印或扫描等复制手段保存和汇编本学位论文。 保密， 在 年解密后适用本授权书。 不保密。 （请在以上方框内打“” ） 学位论文作者签名： 指导教师签名： 日期： 年 月 日 日期： 年 月 日 本论文属于 1 华华 中中 科科 技技 大大 学学 硕硕 士士 学学 位位 论论 文文 1 绪论绪论 1.1 课题来源课题来源 本论文课题来源于湖北省水土保持生态环境建设项目。 1.2 课题的目的与意义课题的目的与意义 地理信息系统（geographical information system，简称 gis）以数字化的形式反 映人类社会赖以生存的地球空间的现势和变迁的各种空间数据以及描述这些空间数 据特征的属性1。然而传统的 gis 软件却不能完全满足 gis 应用的需求，也不符合 软件技术发展的潮流，在许多方面面临着严峻的挑战。 随着 internet 的迅速发展和在全球范围内的普及，万维网（world wide web，简 称 www 或者 web）成为高效的全球信息发布渠道。随着人们对 gis 应用的需求， 利用 internet 技术在 web 上发布和出版空间数据，以供用户浏览、制作专题图、查 询被获取所需的空间数据和应用，是 gis 发展的必然趋势，这就产生了 webgis。 现在越来越多的桌面应用转向 web 平台， 而人们也一直希望日益丰富的 web 应 用能够做到简单易用、高效并具有良好的交互性能。在传统的 web 应用中，用户和 服务器之间的交互都是依靠用户向服务器端发送请求，服务器返回响应并刷新页面。 一种新的用户体验模式的显著特点就是无需下载、安装，操作响应速度快，具有良 好的互动性，尤其是再也没有出现以往那种在等待返回结果期间由于浏览器刷新而 造成的白屏现象。这种令人欣喜的体验源自服务中所采用的 ajax 方法。ajax （asynchronous javascript and xml）并不是一种新的技术。正如它的名字所表现的 那样，ajax 是由几种蓬勃发展的技术以新的方式组合而成：使用 xmlhttprequest 进行异步数据传输；利用 xml 和 xslt 技术进行数据的交换与处理；以 xhtml 和 css 作为显示标准，通过 dom 实现动态显示和交互；而这一切都通过 javascript 串联衔接起来。正是这些传统技术看似简单的重组给 web 应用开发带来新的活力。 对于 webgis 而言，这种良好的用户体验是其应用一直缺乏的，研究与开发人 2 华华 中中 科科 技技 大大 学学 硕硕 士士 学学 位位 论论 文文 员总是难以在性能和使用体验之间找到合适的平衡点。针对这个问题，本文探讨了 ajax 在 webgis 客户端实现中的应用，以期改善用户体验。 1.3 国内外研究现状国内外研究现状 由于 webgis 是空间数据基础设施和“数字地球”建设必不可少的部分，所以 世界各国的专家、学者以及众多高新技术企业正积极投身于 webgis 的研究和发展。 webgis 已经成为 gis 领域研究和实践的热点。 目前 webgis 还存在着许多不成熟的方面。受 internet 带宽和网络通讯能力的网 络环境的限制，构建的 webgis 大多数是局域网或城域网，并且只能完成地理数据 的网上发布，以及简单的空间和属性的双向查询等功能，而不能完成 gis 的分析功 能；并还伴随着网络的安全问题等。 但是 webgis 已经在众多方面影响着人们的生产与生活。随着 internet 走进千家 万户，webgis 可用在经济、环保、交通、旅游、规划、政府决策、城市导游、网上 购物等各个领域。 ajax技术目前已经成为web技术领域应用和研究的热点。 2005年2月， adaptive path 的 jesse james garrett 最早造了 ajax 这个词2。在他的文章“ajax：a new approach to web application” （ajax：web 应用的一种新方法）中，garrett 讨论了 如何消除胖客户（或桌面）应用与瘦客户（或 web）应用之间的界限。此前，google 已经在 google labs 上发布了 google maps 和 google suggest 两个典型的基于 ajax 技术的 web 应用，这在业界引起了轰动，ajax 技术才开始真正为人所认识。如今， ajax 已经成为人们谈论最多的技术术语之一， 这个词的覆盖面有所扩展， 允许浏览 器与服务器通信而无需刷新当前页面的技术都涵盖在内。 自 2005 年以来，ajax 已经成为了 web 应用的主流开发技术，大量的业界巨头 已经采纳并且在大力推动这个技术的发展。继 google 之后，雅虎、微软等公司也开 始迅猛发展 ajax 技术。 更为惊人的是， google 和一批新创公司已经开始利用 ajax 开发出炫目的新一代软件，文本处理、电子表格、演示文稿、日程安排等功能，都 能以 web 形式出现在浏览器中，并且可以免费使用，google office 的传言绝不是空 3 华华 中中 科科 技技 大大 学学 硕硕 士士 学学 位位 论论 文文 穴来风；还有 oracle、sun 等这样的企业软件巨头也已经或者准备在其产品中加入 ajax 技术支持；在国内，传统的门户网站新浪、搜狐、网易等和一些新兴的 web2.0 网站都已经把 ajax 技术应用于实际产品之中，而且取得了很好的效果。 1.4 本文的内容和组织结构本文的内容和组织结构 本文通过对 ajax 技术和 webgis 及其平台 arcims 的由浅入深的介绍， 探讨了 在 webgis 中引入 ajax 技术的可能性和可能存在的问题，并在系统中实现了预期 的目标。 第一章绪论，主要介绍课题的背景和意义，国内外的研究应用现状以及论文的 内容和组织结构安排。 第二章 ajax 概述，主要介绍 ajax 技术的概念，实现原理以及和传统 web 应 用程序相比的优缺点。 在ajax的主要技术中， 重点介绍了xmlhttprequest和json。 最后给出了几个经典的 ajax 应用案例，如 google suggest 和 google maps 等。 第三章 webgis 概述，主要介绍 webgis 的概念、特点和基本原理，然后介绍 了一款 webgis 开发平台arcims，包括它的体系结构，客户端和服务器端组件， 以及 arcims 各个组件之间的通信文件arcxml 等。 第四章 ajax 在 webgis 中的应用，就湖北省水土保持生态环境建设项目 webgis信息发布子系统的项目， 首先分析了在webgis中引入ajax技术的可行性， 然后提出了系统设计原则和要求，介绍了系统的结构，最后实现了系统功能。 第五章结论与展望。总结了论文的内容与不足之处，指出了有待继续完善的地 方，为今后的进一步研究明确了方向。 4 华华 中中 科科 技技 大大 学学 硕硕 士士 学学 位位 论论 文文 2 ajax 概述概述 2.1 ajax 的概念的概念 ajax 全称为“asynchronous javascript and xml” （异步 javascript 和 xml） ， 是一种创建交互式 web 应用的开发技术。 ajax 的概念最早由 adaptive path 的 jesse james garrett 于 2005 年 2 月提出1。 从字面上理解，我们就可以看到 ajax 的几个要点：异步、javascript 和 xml。 完整地说，ajax 主要包括以下几个技术3： （1）使用 xhtml 和 css 表示信息； （2）使用 javascript 操作 dom（document object model, 文档对象模型）实现 动态显示和交互； （3）使用 xml 和 xslt 进行数据交换及相关操作； （4）使用 xmlhttprequest 对象与 web 服务器进行异步数据交换； （5）使用 javascript 绑定和处理所有数据。 ajax 技术并不是一项革命性的新技术， 它是多种成熟技术的整合并以一种崭新 的角色的应用。它在本质就是在客户的浏览器与服务器之间加了一个中间层，使用 户的操作与服务器的响应异步化。一是可以将服务器的一部分工作转嫁到客户端， 减轻服务器的负担。二是由于异步调用的使用，使得用户只需刷新局部的页面，一 定程序上减轻了网络的负担，同时也给用户更好的使用体验。 2.2 ajax 相对传统相对传统 web 应用的优缺点应用的优缺点 早期的 web 技术采用的是同步交互的方式，用户每一次向服务器的提交请求都 导致了整个页面的刷新，一方面浪费了网络的带宽，另一方面也损失了用户与服务 器间的交互性。 运用 ajax 技术，传统的 web 应用中的请求/响应模式发生了改变。开发人员可 以凭借这一技术自由地和服务器进行异步交互。 5 华华 中中 科科 技技 大大 学学 硕硕 士士 学学 位位 论论 文文 使用 ajax 技术的好处有： （1）对于用户来说，最直观的改善是不会因为单击页面上的一个按钮而等待刷 新整个页面。特别是在读取大量数据的时候，不会出现长时间的白屏情况。这样使 得用户体验大大提升，可以和 c/s 模式的应用程序相媲美。 （2）服务器将一部分逻辑转移到客户的浏览器上执行，一定程度上减轻了服务 器的负担。 （3）由于采用异步通信的方式，客户端在和服务器交互时不需刷新整个页面， 大大减轻了网络的流量负荷，节约了带宽。 （4）基于标准化的并被广泛支持的技术，不需要下载插件。 （5）由于需要对页面进行大量的动态交互，进一步促进页面符合标准化开发， 促进内容和表现的分离。 当然，ajax 技术并不是完美无缺的，相比传统 web 应用，它也有一些缺点： （1）浏览器的支持问题。尽管目前的主流浏览器都支持 ajax 的核心技术 xmlhttprequest 对象，但是老版本浏览器对于 xmlhttprequest 的支持却不尽如人 意，一些手持设备（如手机、pda 等）现在还不能很好的支持 ajax，这就要求 web 开发者在开发 ajax web 应用程序的同时，要为这些小群体用户开发出另一个完整 的非 ajax 的应用，这将增加 web 项目的开发成本4。另外，由于上个世纪末的“浏 览器大战”5，使得 html、css、javascript 和 dom 等基于浏览器的 web 前端开 发技术的标准在当时的各主流浏览器之间的支持程度有较大的差异（主要是微软公 司的 internet explorer 和网景公司的 netscape navigator） 。时至今日，主流的浏览器 之间还是存在很多历史遗留问题，这就造成了 web 前端技术在浏览器兼容方面的问 题。不过，随着 w3c（world wide web consortium，万维网联盟）对各种 web 标准 的完善以及各浏览器厂家对浏览器内核的改进，更加符合 web 标准的浏览器将会是 未来发展的趋势。微软最近推出的 internet explorer86就大大改善了对 css 和 dom 等标准的支持。 （2） 客户端程序复杂且难以调试。 ajax 技术将原本完全在 web 服务器中实现 的逻辑（原本在 web 服务中由 php, asp, java 等技术实现） ，部分转移到浏览器中的 6 华华 中中 科科 技技 大大 学学 硕硕 士士 学学 位位 论论 文文 javascript 中来实现，网页中包含有大量的 javascript 代码，因而 ajax 框架是一种 一定具有胖客户特征的瘦客户模型，与传统 web 服务的瘦客户模型相比，ajax 框 架的应用服务器不负责用户界而的构造，这一工作由浏览器来做，所以客户端“胖” 了一些。而构造用户界面的 javascript 却难以调试和测试，因此 ajax 框架的页面往 往相对于传统的 web 页面容易包含更多的 bug 和安全隐患。 （3）可能破坏浏览器中正常的导航方式。ajax 可能破坏浏览器前进和后退 按钮的正常行为7。在动态更新页面的情况下，用户无法回到前一个页面状态， 这是因为浏览器仅能记下历史记录中的 url。由于 ajax 框架页面内容的更新在 不彻底刷新页面的情况下进行，因此虽然网页的内容发生了变化，但是其对应的 url 却是相同的，用户无法通过点击浏览器自带的“前进”和“后退”按钮来抵 达想要达到的页面，而只能点击页面内的元素来进行导航，大大复杂了用户的操 作过程。 2.3 ajax 的原理的原理 2.3.1 传统传统 web 应用程序的原理与特点应用程序的原理与特点 传统的 web 应用程序是基于同步交互的方式，都是由服务器端驱动的静态 html 页面。web 服务器根据用户通过浏览器发送的 http 请求（包含若干信息和 参数） ，在内部调用服务器端解析语言（如 jsp、php、asp 等） ，查找内部的数据库 服务器内保存的相应数据，并经过一些逻辑处理，最后生成一张包含多种元素的的 html 页面，将其显示在用户的浏览器中。 对用户来说，无论是最传统的静态页面还是采取了服务器端解析语言，无论用 户做了填写表单，提交表单向 web 服务器发送请求的操作，还是做了点击超链接的 操作，浏览器的行为都是一致的： （1）完全刷新当前用户请求的页面。 （2）从 web 服务器获取全新的 html 页面。 （3）显示从 web 服务器获取的最新页面，并等待用户的下一次操作。 传统 web 应用程序的模型结构如图 2-1 所示。 7 华华 中中 科科 技技 大大 学学 硕硕 士士 学学 位位 论论 文文 用户界面（ui） 客户端浏览器 web服务器 数据库、后端逻辑等 服务器端 http请求 http数据传输 html+css数据 图 2-1 传统 web 应用程序的模型结构图 基于这种同步交互的方式，传统的 web 应用程序的工作流程是“用户请求 服务器处理并响应用户请求服务器处理并响应” ，它的工作流程如图 2-2 所示。 客户端 服务器端 时间线 用户活动 系统处理 用户活动 用户活动 系统处理 数据传输 数据传输 数据传输 数据传输 图 2-2 传统 web 应用程序的工作流程图 在传统的 web 应用程序下， 用户最大的体会就是 “刷新” 、 “白屏” 、 “显示结果” ， 用户花费大量的时间在等待页面显示结果，用户体验较差。而且传统 web 应用程序 的每一次的请求，会将整个页面信息不加任何处理地提交。这样操作的结果是大量 重复数据在网络中的传递，有限的带宽被冗余的数据的吞噬。在网络带宽资源十分 8 华华 中中 科科 技技 大大 学学 硕硕 士士 学学 位位 论论 文文 珍贵的今天，这是非常需要被关注的关键性问题。 2.3.1 ajax 应用程序的原理与特点应用程序的原理与特点 与传统 web 应用程序不同，ajax 应用程序在用户的浏览器上加了一个中间层 （一般称为 ajax 引擎） 。用户向服务器提交请求并接受服务器响应的过程在后台执 行，并不需再刷新整个页面，从而改变了 web 应用程序交互过程中的“请求响应 请求响应”的模式，用户感觉不到有中断和等待，提升了程序的交互性，也使 程序有了更好的用户体验。 ajax 应用程序的模型结构如图 2-3 所示。 ajax引擎 客户端浏览器 web或xml服务器 数据库、后端逻辑等 服务器端 http请求 http数据传输 xml数据 用户界面（ui） html+css数据javascript调用 图 2-3 ajax 应用程序的模型结构图 在 ajax 应用程序的模型中， 用户要向服务器发出请求， 首先要通过用 javascript 编写的 ajax 引擎，向服务器发出一个异步的请求。服务器在接收客户的请求并处 理数据，将它格式化为特殊的格式(一般为 xml 或 json)并发送给客户端。在客户 端接受了服务器发送回的数据后，再通过 ajax 引擎进行解析和显示。 ajax 应用程序的工作流程如图 2-4 所示。 9 华华 中中 科科 技技 大大 学学 硕硕 士士 学学 位位 论论 文文 客户端 服务器端 时间线 用户活动 系统处理 用户活动 用户活动 系统处理 数据传输 数据传输 数据传输 数据传输 浏览器ui ajax引擎 客户端处理 输入 输入 输入 显示 显示 显示 图 2-4 ajax 应用程序的工作流程图 2.4 ajax 的主要技术的主要技术 ajax 主要包含以下几种关键技术： 2.4.1 javascript 语言语言 javascript 是一种通用的脚本语言， 其编写的程序可以直接在浏览器在解释执行。 它在 ajax 的技术中起着重要的作用。运用它可以完成与服务器的交互，从服务器 所获得信息的处理和显示，对 dom 的操作，完成文档的解析和生成，通过操作 css 实现修改页面的样式，以及一些页面的动态效果等等。javascript 以前一直被认为是 糟糕的语言，常被用来作一些用来炫耀的小玩意和恶作剧或是单调琐碎的表单验证。 但事实上，它是一门真正的编程语言，有着自已的标准并在各种浏览器中被广泛支 持。 2.4.2 xhtml 与与 css xhtml（extensible hypertext markup language，可扩展超文本标记语言）是 一种增强了的 html，它的可扩展性和灵活性将适应未来网络应用更多的需求。因 10 华华 中中 科科 技技 大大 学学 硕硕 士士 学学 位位 论论 文文 为 xhtml 作为 html 的一个子集，能够被大部分浏览器解析，即使老一点的浏览 器兼容性也较好。同时由于它基于 xml 的应用，使得其结构更简洁更严紧，具更广 泛的使用空间8。 xhtml 作为 html 的继承者，完善了 html 在语法上的严密性。对于机器来 说，语法松散的 html 会带来处理的困难，尤其是对于日益增加的移动数码设备， 处理的难度就更加大。因此迫切需要一种语法要求更加严格的页面标记语言，于是 产生了由 dtd (document type definition，文档类型定义)定义规则的 xhtml。 xhtml（html）是 web 应用程序的基础。 css（cascading style sheet，层叠样式表）是一种用来表现 html 或 xml 等文 档显示样式的计算机语言。css 能够针对 html 的标记设置其不同布局、字体、颜 色、背景等属性值，精确的控制页面的实现效果。它为 web 页面元素提供了一种可 重用的可视化样式的定义方法。用于统一修改用户的界而样式。 2.4.3 dom dom（document object model，文档对象模型）是提供给 html 和 xml 使用 的一组 api，提供了 html 文档的表述结构，并允许程序和脚本动态地访问和更新 html 文档的内容、结构和样式。 ajax 所依赖的这四项技术之中， javascript、 css 和 dom 这三个都不是新技术， 它们合在一起被称之为动态 html，或者简称为 dhtml。尽管采用这三种技术可 以开发出交互性很强的动态 html 页面，但是却无法摆脱传统 web 应用程序“请求 等待响应”的模式，使得 dhtml 相比静态 html 空有漂亮的界面，却无法带 给用户本质上的方便，而且相比静态 html，dhtml 还带来了编写、调试复杂等 的一系列问题9。 2.4.4 xml 和和 xslt xml（extensible markup language，扩展标记语言）是一种元标记语言。它用 于定义与特定领域有关的、语义的、结构化的标记语言的句法语言。它是从 sgml （standardized generalized markup language，标准通用标记语言）中简化修改出来 11 华华 中中 科科 技技 大大 学学 硕硕 士士 学学 位位 论论 文文 的。xml 的标记既可以为通用的标记，又可以为相关人士自由决定的标记，从而实 现语言的可扩展性10。 xml 语言用于表示和存储数据，为阅读、验证、交换提供有效的文件格式。通 过 xml 可以规范的定义结构化数据，是网上传输的数据和文档符合统一的标准。因 此用 xml 表述的数据和文档，可以很容易的让所有程序共享和解析。在 ajax 中， xml 用来表示从服务器端传输到浏览器的结构化数据。 xml 有以下几个特点： （1）可扩展性 xml 的基本思想是把文档的内容与样式分开。于是 xml 允许使用者创建和使 用他们自己的标记而不是 html 的有限词汇表。 （2）灵活性 xml 提供了一种结构化的数据表示方式，使得用户界面分离于结构化数据。所 以，web 用户所追求的许多先进功能在 xml 环境下更容易实现。 （3）自描述性 xml 文档通常包含一个文档类型声明，因而 xml 文档是自描述的。不仅人能 读懂 xml 文档，计算机也能处理。xml 表示数据的方式真正做到了独立于应用系 统，能够实现数据重用。xml 文档被看作是文档的数据库化和数据的文档化。 xslt (extensible stylesheet language transformation，扩展样式转换语言)。 xslt 是帮助 xml 转换为其它文档，将 xml 中的原始数据转化为适合不同类型的 应用程序需要的文件格式。 2.4.5 xmlhttprequest xmlhttprequest 对象主要负责与 web 服务器进行异步数据交换。 xmlhttprequest 对象是 ajax 技术中唯一引入的新技术， 它解决了 dhtml 无 法解决的与服务器异步交互、局部刷新页面这个问题。xmlhttprequest 是一个 javascript 类，它并不是一个 w3c 标准，但是大多数主流浏览器都对它有良好的支 持11。xmlhttprequest 对象允许浏览器动态的建立一个 http 请求(以 get 方法或 12 华华 中中 科科 技技 大大 学学 硕硕 士士 学学 位位 论论 文文 者 post 方法)，并解析一个 xml 服务响应，其最大的特点是工作在异步模式下， 根据用户的请求，在后台和 web 服务器进行异步通信。其中，浏览器整个请求的过 程， 包含了 xmlhttprequest 和 css、 dom 的互动， 而这三种技术， 是通过 javascript 来捏和实现的。 整个 ajax 框架技术在实现过程中，参照了桌面应用程序的设计思路。桌面应 用程序之所以具有强大的交互性和实时性，主要归功于其事件驱动的特征，尽管程 序本身无法对未来何时事件被触发做出预测，但是通过事件的回调函数，任何用户 的行为都能被程序截获并做出响应动作。现在主流的 web 浏览器（mozilla firefox, microsoft internet explorer等 ) 对javascript的onkeypress, onmouseover, onreadystatechange 等事件的良好支持，为 web 应用程序交互性的提高打下了坚实的 基础，尤其是对 onreadystatechange 事件的支持12，使得浏览器可以实时的对页面的 状态变化做出反应，随时可对从 web 应用服务器通过 xmlhttprequest 异步请求取 得的数据进行处理。 以下代码片段是用 javascript 实现的最基本的一个 ajax 框架。 有些版本的 mozilla 浏览器处理服务器返回的未包含 xml mime-type 头部信息 的内容时会出错。因此，要确保返回的内容包含 text/xml 信息13。 /初始化一个 xmlhttprequest 对象 var request = getxmlhttprequest(); /从页面中获取用户输入的值 var username= document.getelementbyid(username).value; /生成发送请求的 url 和参数 var url = username= + username; /设定 web 服务器数据返回后的回调函数 request.onreadystatechange = validateusernamecallback; /将地址和请求方法赋子 xmlhttprequest 对象，true 表示异步请求 request.open(get, url, true); /发送 xmlhttprequest 对象到 web 应用服务器 request.send(null); 13 华华 中中 科科 技技 大大 学学 硕硕 士士 学学 位位 论论 文文 request.overridemimetype(text/xml); 简而言之，要完成一个简单的 ajax 的异步请求要完成如下的工作：首先要创 建一个 xmlhttprequest 对象。 然后使用 xmlhttprequest 对象向 web 服务器发出请 求。最后为 xmlhttprequest 对象的 onreadystatechange 属性绑定相应的回调函数， 并根据响应状态对 html 页面处理。 2.4.6 json 随着 web 应用程序的不断流行，xml 几乎成了数据传输的事实标准，但 xml 本身也有一定的缺点。那就是它不够简练。就是对于一个很简单的信息而言，可能 也是要传输大量无关的信息。 douglas crockford 开发了一个内建于 javascript 的数据 格式，称之为 json（javascript object notation，javascript 对象表示）14。 json 是一种轻量级的数据交换格式。易于人阅读和编写，同时也易于机器解析 和生成。 json 采用完全独立于语言的文本格式， 但是也使用了类似于 c 语言家族的 习惯15。这些特性使 json 成为理想的数据交换语言。json 最大的贡献在于，它利 /由于各个浏览器对 xmlhttprequest 支持的方式不一样，ie 以 activex 控件 /的形式提供，而 mozilla 等浏览器则直接以 xmlhttprequest 类的形式提供， /这里是一个通用的获取 xmlhttprequest 对象的方法 function getxmlhttprequest() if (window.xmlhttprequest) return new xmlhttprequest(); else if (window.activexobject) return new activexobject(microsoft.xmlhttp); else throw new error(xmlhttprequest is not supported!); /处理服务器响应的回调函数 function validateusernamecallback() /根据 xmlhttprequest 的 readystate 的状态值判断交互状态 /根据 xmlhttprequest 的 status 的状态码判断 http 请求状态 14 华华 中中 科科 技技 大大 学学 硕硕 士士 学学 位位 论论 文文 用 javascript 的对象表示方法，有效地压缩了 xml 表示文档的字符数。 请看如下所示的 xml 数据： 在 xml 中，每一个有用实际的信息都用类似于这样的 信息所包括，实际上它是可以精简的。利用 json，对这段 xml 数据可以如下表 示： michael 90 17 jack 80 17 classinfo: students: name: michael, average: 90, age:17， name: jack average: 80, age:17 15 华华 中中 科科 技技 大大 学学 硕硕 士士 学学 位位 论论 文文 从上可以很清楚地看到，很多多余的字符不见了，字符数从 xml 数据的 170 减 少到 json 字符串的 106 个。而且 json 是基于 javascript 的，可以在 javascript 中 调用 eval()方法，直接将 json 字符串反序列化成 javascript 对象。利用对象访问属 性的方法， 直接获取其中的数据。 从而可以省去利用 dom 去解析 xml 数据的步骤。 由于 dom 对 xml 的解析本身效率就不是很高，而将 json 反序列化成 javascript 对象，就可以直接通过访问 javascript 对象属性获得数据的值，因而可以更快地访问 其中包含的数据。 ajax 中的这几种关键技术的关系如图 2-5 所示16。 javascript web浏览器 web服务器 xhtml和dom xmlhttprequest css 定义表现和样式 定义内容和结构 与 服 务 器 通 信 通过xml或 json传输数据 图 2-5 ajax 中几种关键技术的关系 16 华华 中中 科科 技技 大大 学学 硕硕 士士 学学 位位 论论 文文 2.5 ajax 应用现状应用现状 （1）google suggest17 google 公司是最早成功的将 ajax 技术应用到商业产品中的18。 google suggest 是采用 ajax 的最早的经典案例之一， 当你输入搜索文字的时候， ajax 异步通讯服 务器，获取搜索结果建议，大大方便了用户。 图 2-6 google suggest （2）google maps google maps19服务己经被人们所熟悉。同 google maps 一样，百度公司也推出 了使用 ajax 为主要实现技术的百度地图，针对中国用户提供国内地图服务（严格 地讲，google maps 和百度地图不能算真正意义上的 webgis，它们功能有限，只能 算是在线地图服务20）。用户在浏览器中输入：，进入 google maps 页面，就可以通过地图提供的缩放工具任意的浏览地图，包括地图的放大、缩 小，以及地图的平移。这个过程中，用户通过一个缩放工具来和网页进行交互，可 17 华华 中中 科科 技技 大大 学学 硕硕 士士 学学 位位 论论 文文 以浏览到各种各样的内容。与传统网页的不同之处在于，在这个过程中用户似乎并 没有向服务器提交什么请求，所有的输入仅为对缩放工具的单击。地图也并没有以 刷新的方式显示，而是每次都在原有数据的基础上以增量方式显示地图。每次通过 缩放工具对地图进行平移操作时，地图中新显示的区域先是一片空白，几秒钟后才 会有更新的内容将空白部分填充。这说明地图在不断的和后台的服务器进行交互， 获得最新的地图数据，然后将其显示于地图上。 图 2-7 google maps 地图服务在客户端方面的活动首先是 ajax 中间层响应用户操作而得到当前比 例尺、视场范围以及鼠标所在屏幕位置等相关信息，然后将屏幕坐标换算为地理坐 标，以异步方式读取相关数据，最后将返回的兴趣点坐标换算为屏幕坐标，在客户 端完成绘制并叠加在地图与影像上。 地图是预先渲染生成的，和卫星影像一样以图像形式存放在服务器端，而且所 有的图像都以某种方式切片后按照金字塔方式组织，客户端充分利用浏览器的多线 程同时下载以加快数据传输速度。当地图窗口发生移动、缩放时，客户端通过大量 18 华华 中中 科科 技技 大大 学学 硕硕 士士 学学 位位 论论 文文 的脚本操作来确定新区域需要的地图图片，然后仅下载新的图片来填充空白区域， 而已存在的地图图片无需下载;地图显示方面只保存道路交通、行政边界等很少变动 的基础数据，即使某些细节发生变化，也可以很快生成该范围的地图切片.相关的含 有地理坐标的兴趣点数据由于经常发生变化，将其存放于后台服务器以方便更新， 底层采用xml和xslt的方式通信21， 显示界面采用信息窗口的方式显示详细信息， 这样既减少了传输数据量又方便了用户的操作。 目前，ajax 已经成为了 web 应用的主流开发技术，大量的业界巨头已经采纳 并且在大力推动这个技术的发展。继 google 之后，雅虎、微软等公司也开始迅猛发 展 ajax 技术。更为惊人的是，google 已经开始利用 ajax 开发出炫目的新一代软 件，文本处理、电子表格、演示文稿、日程安排等功能，都能以 web 形式出现在浏 览器中；还有 oracle、sun 等这样的企业软件巨头也已经或者准备在其产品中加入 ajax 技术支持；在国内，传统的门户网站新浪、搜狐、网易等和一些新兴的 web2.0 网站都已经把 ajax 技术应用于实际产品之中，而且取得了很好的效果。 2.6 本章小结本章小结 本章首先介绍了 ajax 技术的概念，通过与传统的 web 应用程序对比，详细分 析了 ajax 应用程序的优缺点，最后介绍了 ajax 中的几种主要技术和应用现状。 本章的内容为以后各章的探讨和研究做了基本的理论和方法的铺垫。 19 华华 中中 科科 技技 大大 学学 硕硕 士士 学学 位位 论论 文文 3 webgis 和和 arcims 概述概述 3.1 webgis 的概念的概念 webgis 是在 internet 中的一种存储、处理、分析、显示与应用地理信息的系统， 其基本思想就是在互联网上以 web 的形式提供地理信息，使用户可以通过浏览器浏 览并获得一个 gis 系统中的数据和功能服务。它是集计算机科学、地理学、数学等 为一体的新兴科学22。 随着internet技术的不断发展和人们对gis的需求的日益增长， 利用 internet 在 web 上发布空间数据，为用户提供空间数据浏览、查询和分板的功 能，己经成为 gis 发展的必然趋势。 webgis 是一种基于 b/s 模式的 gis 系统， 采用 internet 发布， 提供 wms （web map service）和 wfs（web feature service）两种服务，即地图图像和数据查询。它 是利用互联网技术来扩展和完善地理信息系统的一项新技术，其核心是在地理信息 系统中嵌入 http 和 tcp/ip 标准的应用体系，实现互联网环境下的空间信息管理等 地理信息系统功能。 webgis 将地图与相应的数据库有机地结合起来，实现图形与数据的有效连接， 在查询图形时，可以相应查出地图中某空间实体的相应数据库信息，反之，通过对 实体数据库的查询，可查看相应的地图位置，真正实现信息的动态查询，使各种信 息的浏览和查询变得更加直观、方便、快捷。 3.2 webgis 的特点的特点 （1）基于 internet/intranet 标准 webgis 支持 internet 网络通讯和 tcp/ip 和 http，采用标准的 web 浏览器作 为应用外壳。支持 tcp/ip，webgis 可以和任何地方的空间数据相连，这是 webgis 实现的基础和前提23, 24。 （2）分布式