Web应用开发基本原理.docx
《Web应用开发基本原理.docx》由会员分享，可在线阅读，更多相关《Web应用开发基本原理.docx（11页珍藏版）》请在冰豆网上搜索。
Web应用开发基本原理
Web应用开发基本原理
Web应用原理
简介
Web应用是基于HTTP协议的，Web应用也被常常被称为B/S（Browser/Server，浏览器/服务器）应用，这是针对传统的C/S（Client/Server，客户端/服务器模式）模式而言的。
但是Web应用其实也是一种客户端/服务器的应用，只不过客户端使用的是统一协议的浏览器而已。
传统的C/S结构是两层结构，客户端直接和数据库连接，这种模式存在着非常大的安全隐患，目前已经逐步消亡了。
但是作为3层结构（UI—BizServer—DB）的结构会长期和B/S结构共存。
优点
缺点
B/S
●具有分布性特点，可以随时随地进行业务处理。
●业务扩展简单方便，通过增加网页即可增加服务器功能。
●维护简单方便，只需要改变网页，即可实现所有用户的同步更新。
●开发简单，共享性强。
●个性化特点明显降低，无法实现具有个性化的设计要求。
●操作的习惯性是以鼠标为最基本的操作方式，无法满足快速操作的要求。
●页面动态刷新，响应速度明显降低。
●专用性打印输出难以实现，尤其对票据等打印，难以实现套打输出。
●无法实现分页显示，给数据库访问造成较大的压力。
●功能弱化，难以实现传统模式下的特殊功能要求。
●界面组件扩展性差
C/S
●客户端实现与服务器的直接相连，没有中间环节，因此响应速度快。
●客户操作界面设计灵活，容易满足客户自身的个性化要求。
●界面组件丰富
●客户端实现与服务器常常是以长连接相连的，因此会降低并发数。
●由于是针对性开发，因此缺少通用性的特点，业务变更或改变不够灵活，需要重新设计和开发，增加了维护和管理的难度，进一步的业务拓展困难较多。
● 需要专门的客户端安装程序，分布功能弱，不能够实现快速部署安装和配置。
● 兼容性差，对于不同的开发工具，相互之间很难兼容，具有较大的局限性。
若采用不同工具，需要重新改写程序。
● 开发成本较高,需要具有一定专业水准的技术人员才能完成。
Web基本交互图
C/S模式的交互模型
●客户端将数据传输给服务器
●服务器将数据传递给客户端
Web交互的基本模型：
●浏览器将数据传输给服务器
●服务器将显示和操作代码传递给浏览器
浏览器的作用
●数据收集
●传输协议
●解释显示语言/解释脚本
●响应用户操作
Web传输协议网络堆栈
对于Web开发主要是使用Web应用层和HTTP层的协议进行开发的，Web应用层具有多种协议：
HTML：
显示语言，使用统一的MarkerLanguage解释客户端显示组件以及其摆放规则。
DHTML：
HTML的对象模型，主要和脚本引擎一起提供页面操作/动态页面显示等功能。
CSS：
界面风格描述，主要用于描述组件的特性。
Javascript/VBScript：
脚本引擎主要用于结合DHTML提供页面操作/动态页面显示等功能。
VML：
图形化建模语言。
在除了物理层的以下各层，Web服务器一般都能为应用服务提供相应的接口：
输入：
链路层：
MAC地址
IP层：
IP地址
TCP层：
TCP端口
HTTP层：
HTTPHeaders（QueryString/Cookie/Accept-Type/Content-Type等）
Web应用层：
ViewState/Form服务器端组件状态等
输出：
HTTP层：
HTTPHeaders（QueryString/Cookie/Accept-Type/Content-Type等）
Web应用层：
HTML/Javascript/HTC/xml/pic等
HTTP协议
Http协议格式
●URL格式
:
//?
，
主要由几部分构成：
1.protocol
在这里的协议是HTTP
2.domain
一般的格式是<服务器>:
<端口号>，如果没有端口号，HTTP缺省为80
3.virtualpath
虚拟路径，第一个字符是”/”，代表相对于服务器Web应用根的路径。
4.queryString
参数值，以<名>:
<值>模式的多个域的组合，域和域之间以”&”分割。
注意：
这里的每个域的名称在QueryString中可能不是唯一的。
●HTTP头
主要是指<名>:
<值>模式的多个域的组合，域和域之间以回车（\r\n）分割，如果出现两个回车，就证明HTTP头已经结束。
注意：
HTTP域在HTTP头中不是唯一的。
●Form提交格式
以<名>:
<值>模式的多个域的组合，域和域之间以”&”分割。
注意：
这里的每个域的名称在QueryString中可能不是唯一的。
●请求（Request）
HTTP/
method：
主要有两种，一种是POST，一种是GET。
通常POST会带Content-Length的HTTP头，用来传输数据。
url：
访问服务器的虚拟路径，比如我们在浏览器中输入”http:
//localhost/webapp/webapp1.aspx”,那么虚拟路径是指”/webapp/webapp1.aspx”。
version：
当前HTTP协议是1.1版本
content：
如果HTTP头中存在Content-Length，则在content部分就会有对应长度的（字节为单位）内容。
●回应（Response）
HTTP/
version：
当前HTTP协议是1.1版本
statusCode：
服务器传回的访问的整数状态码，一般成功的是200或者201，跳转是302，服务器内部错误是500，请求错误是400，没有页面是404
statusDescription：
状态描述，针对状态码的描述信息
content：
和请求是一样的
特殊的HTTP头
●Content-Length
放在HTTP头后的内容长度
●Content-Type
放在HTTP头后的内容类型以及字符集编码，常见内容类型有
POST的类型一般是"application/x-www-form-urlencoded"
XML类型的数据使用”text/xml”
HTML类型的数据使用”text/html”
javascript类型的数据使用”text/javascript”
●Content-Encoding
编码规则，用于表明
●Set-Cookie
服务器传递的，专门用于设定浏览器cookie的（可以设定Cookie的名值对，有效路径，以及是否强制使用安全通道等）
●Cookie
浏览器传递的，将服务器设定的cookie返回给服务器
例子
●用户在浏览器输入URL，访问该URL
●用户在浏览器中输入内容，点击”提交”按钮，提交内容
Web应用服务器
传统的Web应用服务器仅仅是一个HTTP协议处理器，框架提供了基本的HTTP模型，包括QueryString/Form/HTTP头/Cookie/Session等，而ASP/JSP仅仅多了动态生成接口的方法（ASP是解释执行的）。
以下我们将介绍基本对象模型
Request
客户端请求对象，一般最重要的属性/方法有：
●QueryString
获取请求的QueryString，一般的都会将名值对做成Hashtable。
但是由于QueryString的域名称不是唯一的，因此Hashtable中记录的实际上是Array。
在.NET当中，使用缺省的
●Form
获取请求中Content（使用POST）的内容，一般的都会将名值对做成Hashtable。
但是由于Form的域名称不是唯一的，因此Hashtable中记录的实际上是Array
●Params
是将QueryString和Form合成一块。
●Header
获取请求的HTTP头，一般的都会将名值对做成Hashtable。
但是由于HTTP域名称不是唯一的，因此Hashtable中记录的实际上是Array
●Content-Type
内容类型以及内容编码。
●RequestStream
将Content作为流来操作。
Response
服务器应答对象，一般最重要的属性/方式有：
●Header
设定响应的HTTP头
●Content-Type
内容类型以及内容编码。
●Write
将数据写在输出的Buffer中，该输出Buffer以后将直接写在HTTP相应的Content部分。
在传统的Web服务器中，可以支持Web网页的HTML和服务器脚本嵌套，实际上在该服务器页面编译之后，其结果就是Response.Write方法。
例子：
服务器脚本
<%=1%>
服务器代码生成后的程序
Response.Write（“”）;
Response.Write
（1）;
Response.Write（“”）;
Session
Session主要作用是用于纪录会话的状态，其实质是服务端是一个记录名值对的Hashtable，其还有一个全局唯一标示的SessionID。
服务器将这个Session保留在SessionTable中（SessionID和Session对的Hashtable）。
在传输的时候服务器会将SessionID通过Cookie的方式传递给客户端，因此在客户端也可以看作服务器对象指针。
执行过程如下：
●服务器制作Session，并将Session放在SessionTable（Hashtable）中，然后将SessionID打包到Cookie中传递给浏览器。
如果服务器要记录状态，则利用这个Session对象将状态名和状态值记录起来。
●浏览器在浏览服务器的其他网页的时候将Cookie传递回服务器
●服务器如果需要找到当前会话的某个状态值，则将Cookie解开拿到SessionID，并在SessionTable中找到Session，然后在Session中通过状态名获取该状态值。
一般的SessionTable添加/找到Session的步骤，是由框架做的。
Application
Application变量的主要目的在于纪录全局的状态，也是一个名值对的Hashtable
HTML/DHTML和HTTP的接口
HTML/DHTML和HTTP的接口其实是单向接口
说明
执行方式
打包方式
Form/Input元素
form.submit方法
Form在提交的时候（执行form.submit或者点击submit类型的input按钮的时候）会把Form提交到HTTP接口中去。
Form提交首先收集该Form内所有的（包括子Form）的input元素的value值（如果多个submit，则选择点击的那个），然后打包。
*
点击或者脚本执行
按照method指定的方法，缺省是POST
A元素的href属性
用户点击该超连后，页面路由到该href指定的页面当中。
点击
GET
src属性/behavior的url属性/import的implementation属性
在浏览器获得回应生成页面时候，会自动打包申请
HTML语言自动执行
GET
document.location=
脚本执行
GET
window方法集合
open
navigate
showModalDialog
showModalessDialog
脚本执行
GET
*form提交的伪码
functionform_submit（）
{
//收集所有form内部的tag为input的元素
varelms=event.srcElement.form.all.tags（“input”）;
varpostString="";
for（vari=0;i{
varelm=elms[i];
if（elm.type==submit&&elm!
=event.srcElement）
continue;
if（elm.name==null||elm.name.length==0）
continue;
if（postString.length!
=0）
postString+="&";
postString+=elm.name+"="+elm.value;
}
HttpPost（postString）;
}
升级会员 