Hello Web(二):静态网页与动态网页

网页是如何产生的

根据文章Hello Web(一)中所描述的情况，网页本身是一个HTML文件，经由浏览器发送HTTP的Request请求，从服务器返回的Response中浏览了HTML文件的内容。

从以上过程中可以看出，浏览器展示什么样的网页完全取决于HTTP的Response报文内容，而不是取决于HTML文件中真是存在的内容。如果在传输过程中产生了意外造成了部分报文丢失，那么展示出的完全是另外一个样子的页面。

HTTP请求和网页的独立发展

视图与数据

HTTP请求并不是天生为网页而存在的，HTTP在设立的时候并没有要求其报文必须是HTML文本(虽然当时超文本只有HTML一种)，HTTP缩写的前两个字母Hyper Text是指的任何承载了 符号 本身含义以外的文本，HTML只是Hyper Text的一种，另外的比如XML。

由于HTTP本身并不是单纯为传送网页而存在的，所以也有人使用XML文本来单纯的传送结构化数据(后来又出现了JSON)

静态与动态

1. 静态的视图： 一旦HTML文本书写的文件完成，在浏览的过程中，其本身不会发生任何变化，属于静态。
2. 动态的数据： 结构化数据中，虽然确定了数据名(Key-Value)中的Key，其Value是可能随时发生变化的

其中动态的数据是由服务器中一系列逻辑代码生成，这些将会在下一章节Hello Web(三):接口与后台中进行详细分析。

动态网页的产生

在基于 静态的视图 和 动态的数据 的基础上，有人考虑说，我可以不可以 根据逻辑不同生成不同的网页，而不是单一不变的，把页面中加入动态的数据的特性 。

JSP

在2006年，JSP 2.1的规范作为Java EE 5的一部分被Sun公司发布，其作为Java Servlet 2.1 的一个扩展用来处理动态网页，Servlet是什么参考这里，其本身以HTML文件为基础，新定义了一种JSP格式，加入了新的标签以及Java代码段，简单的来讲

JSP ＝ HTML ＋ JAVA

而Servlet是Java语言里HTTP的一种实现，来链接 服务器本地逻辑 转化成 网络请求 的工具，所以此时就相当于在HTML的文本里加入了动态的数据特性。

JSP文件可以被浏览么

在上一章中所讲述的，page.html被保存在服务器端口，可以通过服务器进行浏览，那么JSP文件被保存在服务器端，我们浏览的时候为什么看不到JAVA代码呢？

在任何一个JSP的讲解中都会讨论的一个问题是，先有Servlet还是先有JSP，答案是 先有Servlet ，在Tomcat容器中，一旦你放入了包含JSP的War包，在访问时会在 work 目录中生成带有 _jsp 后缀的Java和Class文件，该文件就是一个Servlet。

访问URL	对应服务器文件夹	对应Servlet文件
http://127.0.0.1:8080/dynamic/page	Tomcat/webapps/ROOT/dynamic.war/page.jsp	Tomcat/work/ROOT/dynamic/…/page_jsp.java

由于Servlet是对HTTP对实现，所以说此时并不存在一个可以被浏览的HTML文件，而是一个基于后台逻辑的Servlet，浏览这个对应JSP的后果是 返回了一个恰好包含了HTML文本的HTTP报文 基于上一章的结论，你在浏览器前看到了一个网页。

动态网页和静态网页的实质区别(结论)

巴拉巴拉讲了一大堆，此处可以得到结论 静态网页是一个实际存在的HTML文件，而动态网页是一种通过HTTP传输的后台逻辑，只是Response报文恰好是HTML文本

所以说动态网页是作为了一种桥梁，把后台的逻辑变化实时的反映到了前台浏览的视图上，值得注意的是JSP仅仅是动态网页技术的一种，还有很多其它技术，但是原理相似。

动态网页的弊端与Ajax

与动态网页研究同步进行的还有另外一个技术Ajax(Asynchronous JavaScript and XML)，其采用了完全不同的方式在静态的HTML文本中加入 动态的数据 ，而且解决了动态网页的两个弊端

1. 一个网页中，数据占据视图很少的一部分，动态网页每次都是生成完整的视图，大部分不变的静态信息第二次传递是多余的
2. 动态网页每次被访问都要在后台执行相同的逻辑，耗时较多

Ajax

Ajax技术于2005年发布，甚至早于JSP的公开版本，其采用多次发送请求的方式

1. 第一次请求浏览静态网页
2. 第二次请求获得动态的数据
3. 使用JavaScript脚本语言在浏览器端操作HTML展示动态的数据

由于静态网页不需要执行后台逻辑，可以响应速度相对较快，可以在先展现了页面的情况下减少用户的等待时间，然后通过XML(或JSON)文本传送格式化的数据。

Ajax与动态网页的区别

技术名称	发送HTTP请求次数	视图与数据获取步骤	视图与数据是否分离
动态网页	单次请求	一次性获取视图和数据	没有分离
Ajax	多次请求	首先获得视图再分批获得数据	产生分离

Ajax的弊端

Ajax虽然把单次响应时间分散成了多次，给人感觉似乎更加优秀，但是其也有很多弊端

1. 多次请求不可控，每次请求都有失败的可能性造成部分数据丢失
2. 改变前端视图的过程中需要准确的操作
3. Ajax需要接口化，同一个页面需要分为页面和接口

Ajax的前提：接口

在静态网页中，每次发送HTTP请求得到的是一个包含了HTML文本的返回报文，从而得到是一个网页，如果为了获取到数据而发送的HTTP报文，得到纯粹是格式化的的数据，我们称呼这种URL为 接口 下一章 Hello Web(三):接口与后台 将进行讲解

结束语

在实际的网页使用中，并没有严格的动态网页和静态网页的区分，会经常结合使用，从展示效果上来看 基本上目前主流认知是

动态网页 ＝ 静态网页＋Ajax

赏

请问老板还招人么(/ω＼)

支付宝

微信