深入理解BS结构应用程序

随着学习的深入，和编程经验的丰富，对BS应用程序有一些认识。

　　在一些讨论软件技术的QQ群里，或一些社区、BBS中，经常会有一些初学者会犯一些认知性的错误。比如经常会有一些朋友提这样的一些问题：“我怎么在ASP中调用我写的这个JavaScript函数啊？”或者说“我怎么在JavaScript中调用我DAL层读取数据的方法啊？”

　　对于这些问题，说实话，我也犯过，当时也纠结的不得了。现在想想，其实是对BS结构的程序没有一个整体的概念，或者可以说根本不知道什么叫BS结构的应用程序。因此，学习过程中会走不少弯路，经历不少痛苦。

　　经过这几年的学习，有一些心得经验，和大家分享一下。

　　要理解BS这个概念，必需要从BS应用程序的起源说起。

　　BS应用程序又称Web应用程序。其实最初Web并不是应用程序，它只是一种服务，一种共享信息的服务。

　　Web是什么，是网，是网络。最早的网络只是提供了一种下载并打开远端页面文件的一种服务，人们可以通过远程计算机中的地址和文件保存的路径来查看该计算机中共享的文件。这些文件通常是一页页的文本内容，在网络中访问它的那个路径称为Uniform / Universal Resource Locator（URL，统一资源定位符）。

　　后来人们在页面中加入了超链接，使浏览者可以很方便的访问其它相关的文件资源。这样，从感观上我们访问的网页由一页变成了很多页，也就更奠定了“Web Page（网页）”这个名称。

　　随着Web的发展，网页中加入了图片、动画、声音、视频等多媒体元素，这些东西超出了文本的概念，并且出现了一种标记语言来规范这些页面中的元素，使之更加合理的显示在用户的屏幕上。所以，这种语言就被人们称之为HyperText Mark-up Language（HTML，超文本标记语言），这种文件的扩展名为html或htm（还有其它如shtml的延生品）。而专门解悉这种语言，给用户展示完美的网页内容的程序，就被称之为浏览器。

　　后来，人们发现，随着页面内容的丰富，有时候很多页面中的结构是完全相同的，只是内容不同而已。这样如果提供很多的网页文件，不仅浪费计算机硬盘空间，也非常不容易维护。所以就有人想出在远端计算机（Web服务器）中动态生成网页的方法来解决这个问题。这样就可以在硬盘中保存一份有共同页面结构的网页，在用户请求查看某个信息的时候，Web服务器根据用户请求的文件地址（URL），解悉并生成一份最终的页面内容，回传给请求者，请求者接收到以后就像普通文件一样获取并打开它。

1 //（注：这些动态生成网页的技术，最早的有CGI，后来出现ASP，PHP，JSP，ASPX等等）

 
1 /*
2 （注：在这里，要特别强调的一点，也就是每一个BS结构应用程序开发人员要牢记的是：
用户（请求发送者，或者称为浏览器、客户端）向远程计算机请求，
请求的永远是文件资源（后来出现的Ajax技术可以获取一段文本），
可以是网页文件、图片文件、动画文件、声音文件等等）
3  */
 

　　至此，对于用户来说页面内容也非富了（有了多媒体），对于服务器来说页面也可以动态生成了（更易于管理）。但美中不足的是：虽然有了非常酷的页面效果，但对用户交互方面的元素太少。人总想主动的控制一些优秀的东西，而这样的网页除了点击超链接，我们不能对它进行其它更多的操作。

　　这似乎是点缺憾，但对于充满智慧的劳动人民来说，这并不是什么问题。网页开发人员研究了一种可以供浏览器解释执行的脚本代码（脚本代码种类非常多，最为典型的是JavaScript），这些代码可以做为页面的内容直接写到网页文件中，也可以做为类似图片一样的外部资源被页面引入执行。

　

　　有了这些页面脚本，我们的Web即刻变得炫丽起来。我们可以像普通的WinForm程序一样，使用鼠标在页面中执行单击、双击、拖放等操作（随着这些操作，衍生出来许多的浏览器事件）。

　　如此，我们的BS应用程序的整个技术体系就变的完美了。

　　在整个BS应用程序的发展过程中，上面提到的各个相关技术都充当着一个功能明确的独立模块。这一切都围绕着“使用户能远程获取信息”这一主线。服务器使用动态网页程序生成不同内容的Web页面，并提供相关的图片等页面外部资源；HTML是为了链接外部资源，并标记如何组织页面中的元素；浏览器负责请求服务器获取网页内容以及与之相关的其它外部资源文件，解悉页面结构，并将获取到的内容（文本内容或多媒体内容）组织起来，更加美观的呈现给用户；页面中的脚本程序是做为页面的辅助内容保存在页面中，在适时的时候响应用户的操作，执行一些浏览器内的动作。

　　下面我们来看一下浏览器对服务器进行一次请求的整个过程演示图：

1．  首先浏览器请求服务器

2．  服务器接收到浏览器的请求

3．  服务器解悉浏览器请求的URL，根据URL确定请求的目标资源文件。这个资源文件通常是一个动态页面（如ASP，PHP，JSP，ASPX等文件）的网络地址（MVC结构的程序例外）。Web服务器根据动态页面文件的内容，和URL中的参数，调用相应的资源（数据库或文件）组织数据，生成HTML页面。（注意这里生成的是一个HTML文档，里面可能包含JavaScript代码等，这里在服务器端不管HTML文档里的具体内容）

4．  生成HTML文档以后，服务器响应浏览器的请求，将生成的HTML文档发送给浏览器

5．  浏览器接收请求得来的HTML文档

6．  浏览器对HTML文档进行解悉，并请求相关的资源文件（JS，CSS，多媒体资源，内嵌网页）等。(在这里浏览器解悉完HTML文档以后，就会进行呈现，但同时也会向服务器发送请求来请求其它相关的资源文件)

7．  服务器接到浏览器对资源文件的请求以后，将相应的资源文件响应给浏览器

8．  浏览器接收到请求来的资源文件，整理并呈现到页面中

9．  在进行页面呈现的时候，浏览器会从上到下执行HTML文档，当遇到相应的页面脚本的时候，会对脚本进行分析，并解释执行相应的脚本代码

　　其实在第6步以后，我们就可以看到一部分页面内容了，不过可能是纯文本内容，没有样式，没有图片或其它资源。待到浏览器请求得到某资源的时候就会进行组织呈现。直到整个页面显示完成。

　　不过最后我们要重点理解的是，在服务器端，HTML是做为一个文本文件进行处理的，包括HTML中的脚本，都被服务器端程序视之为文本。到浏览器中，呈现HTML时执行JavaScript脚本程序，就纯粹是一个独立的的小程序了，程序的运行边界是浏览器，也就是说它不可能超越浏览器运行。而浏览器和服务器之间交互就只能使用“请求”+“响应”的模式进行，Web开发中的异步交互技术Ajax也是使用该模式与服务器传递信息的。

　　扯蛋一句：服务器和浏览器理论上是在两台不同的计算机中运行的，所以它们不可能共享内存中的变量或者方法。而且他们根本就不是同一时间运行的，所以也不可能共享这些数据。