WebGIS开发基础

Web开发基础理论

B/S架构

Web软件开发通常使用B/S（Browser/Server，浏览器/服务器）架构，这是Web兴起后的一种网络结构模式，是目前网络开发的主流趋势。
B/S架构采用开放式的浏览器/服务器架构，其基本结构一般包括Web服务器、Web页面、Web浏览器和HTTP协议等部分，如图2-1所示。HTTP协议是基于客户器/服务器架构的信息分布方式，原意为“请求-响应模型”，即将包含信息等网页文档存放在Web服务器上，客户端以Web浏览器为媒介，通过程序向Web服务器发出请求并访问相应的Web网页。基于B/S架构的Web应用，将Web应用程序安装部署在服务器端，客户端直接通过Web浏览器访问，如网络上常见的门户网站、论坛、商城等。

图1 Web 基本结构

Web应用的经典多层架构为表现层、业务逻辑层、数据访问层、数据源。对应于Web的多层结构，从物理角度划分，依次为数据服务器、Web 服务器、客户端（浏览器）三个核心构件。Web应用的多层架构如图2所示，

其中，Web应用程序主要分为Web客户端与Web服务器端，即通常所说的Web前端与Web后台。Web客户端通常指表现层；Web服务器端则包括业务逻辑层与数据访问层，目前使用Web S ervice（Web服务）封装系统的业务逻辑功能与数据操作功能成为主流趋势之一。整个Web系统开发完成后，将编译后的Web应用程序部署在Web服务器上，数据库则部署在数据服务器上，用户通过客户端的浏览器（如IE）进行访问。

（1）表现层（UI）：负责用户与整个系统的交互，通俗地讲就是展现给用户的页面，即用户在使用一个系统的时候，他的所见即所得。

（2）业务逻辑层（BLL）：与系统所应对的业务（领域）逻辑有关，负责业务规则的制定、业务流程的实现等。针对具体问题的操作，即对数据业务逻辑处理，是针对数据层的操作。业务逻辑层扮演两个不同的角色：对于数据访问层而言是调用者；对于表现层而言是被调用者，可以使用Web S ervice的服务模式实现。

（3）数据访问层（DAL）：该层主要是数据库的操作，主要负责数据库的访问，实现对数据表的选择、插入、更新、删除操作，同样可以使用基于Web S ervice的服务模式实现。

Web 应用的多层架构设计具有很多优势：开发人员可以只关注整个架构中的其中一层；可以很容易地用新的实现来替换原有层次的实现；可以降低层与层之间的依赖；有利于标准化；有利于各层逻辑的复用等。基于多层架构设计的Web应用，具备良好的数据兼容性、可移植性，维护方便。随着Web技术的发展，为解决共享难、复用差、跨平台难、业务混乱等诸多问题，Web S ervice技术应运而生。基于Web S ervice的服务模式成为Web应用的主流趋势。Web应用也趋向于前/后端分离，由此衍生出了Web前端开发与Web后台开发。

在Web发展过程中，用户需求和技术进步是推动架构进步的动力。在设计一个Web应用的架构时，要切实满足当前用户需求，同时考虑应对发展变化的灵活性。因此，Web 应用架构的扩展性非常关键。如果每次在需求变化时都会导致架构进行重大改动，那么这无疑是一个失败的设计。

客户端技术

Web前端开发技术包括网页开发技术、客户端交互实现技术等。Web前端开发技术的三要素为HTML、CSS和JavaScript，但随着RIA的流行与普及，Flash/Flex、Silverlight等也非常受欢迎。随着时代的发展，Web前端开发技术的三要素已经演变为现在的HTML5、CSS3、jQuery。

1.HTML

HTML（Hypertext Markup Language）即超文本标记语言，是用于描述网页文档的一种标记语言。它通过在用户文档中加入特定的控制字符或命令，使文档能够按照用户期望的格式输出。HTML语言主要用于客户端的页面设计。HTML作为互联网上“通行无阻”的语言，简单易用但功能强大，支持不同数据格式的文档嵌入，具有简易性、可扩展性、平台无关性等特点。

HTML文档是使用HTML语言编写的ASII文本文档，扩展名为.htm或.html，主要用于定义Web页面的内容与显示格式。HTML文档包含文档（显示）内容与HTML标记两部分，其标记基本上是成对出现的，即由一个开始标记和一个结束标记组成。

随着Web技术的发展与应用，HTML不断丰富和规范，形成相应的各个版本。HTML5 的第一份正式草案已于2008年1月22日公布，目前仍处于发展阶段，但大部分浏览器已经支持某些HTML5技术。HTML5有两大特点：首先，强化了Web网页的表现性能；其次，追加了本地数据库等 Web 应用的功能。广义上的 HTML5，实际指的是包括 HTML、CSS 和JavaScript在内的一套技术组合，它希望能够减少浏览器对于需要插件的富互联网应用（RIA）的需求，并且提供更多能有效增强网络应用的标准集。

2.CSS

CSS（Cascading Style Sheet）即级联样式表，通常又称为风格样式表（Style Sheet），用来进行网页风格设计，即表现HTML或XML等文档的样式。比如，如果想让链接字在未单击时是蓝色的，当鼠标指针移上去时变成红色且有下画线，这就是一种风格。通过设计级联样式表，可以统一控制HTML中各标志的显示属性，能够更有效地控制网页外观，具有精确指定网页元素位置、外观以及创建特殊效果的能力。

在站点网页上使用的级联样式表有三种：外部样式表、内页样式表、行内样式表。其中，网页链接到外部样式表，为网页所创建的嵌入式样式将扩充或覆盖外部样式表中的指定属性。在设计 Web 页面时，通常采用 CSS+DIV 的页面布局。相比传统的用 Table 布局的页面，CSS+DIV方式具有代码精简、易重构、访问网页速度快、浏览器兼容性好等优点。

CSS 目前的最新版本为 CSS3，是能够真正做到网页表现与内容分离的一种样式设计语言。相对于传统HTML而言，CSS能够对网页中的对象位置排版进行像素级的精确控制，支持几乎所有的字体、字号、样式，拥有对网页对象进行显示控制的能力，并能够进行初步交互设计，是目前基于文本展示的最优秀的设计语言。HTML5兼容CSS3，使得HTML5的应用更加广泛。

3.JavaScript

JavaScript的前身为LiveScript。在Netscape公司与Sun公司合作之后，引进Java的程序设计概念，将其改名为JavaScript。之所以取名为JavaScript，原因在于JavaScript是一种嵌入HTML文档的、基于对象的脚本设计语言，语法同Java语言很相似，而且JavaScript的设计使得它很容易同Java语言一同工作，还可以充分支持Java的Applet应用程序。目前，几乎所有的浏览器都支持JavaScript语言。