Web 程序运行原理简介

1. Web 基本原理

1.1 运行原理

用户打开浏览器，输入网址后按 Enter键，浏览中就器会显示出用户想要浏览的内容。在这个看似简单的用户行为背后到底隐藏了些什么呢?

用户浏览网页的原理如图所示：

简要流程如下：

1. 用户打开客户端浏览器，输入URL地址。
2. 客户端浏览器通过HTTP协议向服务器端发送浏览请求。
3. 服务器端通过 CGI 程序接收请求，如果在客户端浏览器请求的资源包中不含动态语言的内容，则服务器端CG程序直接通过 HTTP 协议向客户端浏览器发送应答包；如果在客户端浏览器请求的资源包中含有动态语言的内容，则服务器会先调用动态语言的解释引擎处理“动态内容”，用 CGI 程序访问数据库并处理数据，然后通过 HTTP 协议将处理得到的数据返给客户端浏览器。
4. 客户端浏览器解释并显示 HTML 页面。

1.2 DNS 的概念

DNS（Domain Name System，域名系统）提供的服务是：将主机名和域名转换为 IP 地址。
其工作原理如下图：

DNS 解析的简要过程如下：

1. 用户打开浏览器，输入URL地址。浏览器从接收到的URL中抽取出“域名”字段(即要访问的主机名)，并将这个主机名传送给DNS应用程序的客户端。
2. DNS客户端向 DNS 服务器端发送一份查询报文，其中包含要访问的主机名字段。
3. DNS服务器端给 DNS 客户端发送一份回答报文，其中包含该主机名对应的IP地址。
4. 该浏览器在收到来自 DNS 的 IP 地址后，向该P地址定位的 HTTP 服务器端发起 TCP 连接

需要注意的是，客户端与服务器端之间的 通信是非持久连接的，即服务器端在发送了应答后就与客户端断开连接，等待下一次请求。

2. HTTP 简介

HTTP( Hyper Text Transfer Protocol, 超文本传输协议), 是一个简单的请求-响应协议，通常运行在TCP协议之上。它指定了客户端可能发送给服务器端什么样的消息，以及得到什么样的响应。请求和响应消息的头是以ASC码形式给出的；而消息内容则是以类似 MME 的格式给出的。

在HTTP传输过程中，客户端总是通过建立一个连接与发送一个HTTP请求来发起一个事务。服务器端不能主动与客户端联系，也不能给客户端发出一个回调连接。客户端与服务器端都可以提前中断一个连接。

Tip：
HTTP协议是无状态的：同一个客户端的这次请求和上次请求是没有对应关系的，HTTP服务器端并不知道这两个请求是否来自同一个客户端。 为了解决这个问题，Web程序引入了 cookie 机制来维护连接的可持续状态。

3. HTTP 请求

客户端发送到服务器端的请求消息由请求行( Request Line)、请求头( Request Header)、请求体( Request Body)组成。

3.1 请求行

请求行由请求方法、URI、HTTP协议/协议版本这3部分组成。例如在访问百度首页时，通过 F12 键查看请求行，可以看到请求采用的是HTTP1.1协议。

关于 GET 请求与 POST 请求的区别

3.2 请求头

可以通过浏览器查看请求头信息：例如，打开浏览器，输入 www.baidu.com.com 访问百度首页， 按F12键，依次单击 F12, Network，www.baidu.com, Headers, Request Headers 选项。

请求头包含服务器要使用的附加信息，比较重要的信息有 Cookie、Referer、User-Agent 等。

3.3 请求体

请求体是指在HTTP请求中传递数据的实体，常用于POST、PUT等请求中 例如在表单请求中，当我们提交一个POST请求时，会将一个页面表单中的组件的表单数据值通过 param=value11&param22=value22 的键值对形式编码成一个格式化串，并通过请求将其传递给服务器端。

不但请求体可以传递请求参数，GET请求URL也可以通过类似于 /chapter/index.html? param11=value1param22=value22 的方式传递请求参数。

4. HTTP 响应

HTTP响应由服务器端返回给客户端，可以分为3部分：响应状态码( Response Status Code)、响应头( Response Headers)和响应体( Response Body) 。

4.1 响应状态码

响应状态码表示服务器的响应状态，例如 200 代表服务器正常响应，404 代表页面未找到等。

4.2 响应头

打开浏览器，输入“www. “www.baidu.com” 访问百度首页。按F12键，依次单击 Network、www.baidu.com、Headers、Response Headers选项，即可查看响应头信息。

响应体也可以是一个 JSON 或 XML 的文档。

5. HTTPS 简介

HTTPS 是以安全为目标的 HTTP 通道。它在 HTTP 的基础上，通过传输加密和身份认证保证了传输过程的安全性。

TTL( Transport Layer Security,传输层安全性协议), 及其前身 SSL( Secure Socket Layer 安全套接字层)是一种安全协议，目的是为互联网通信提供安全及数据完整性保障。 在采用SSS/TLS后，HTTP就拥有了HTTPS的加密、证书和完整性保护这些功能。即 HTTP 在加上加密处理、认证和完整性保护功能后即是 HTTPS.

6. HTTP 2 简介

相比HTTP1.1, HTTP2新增了头信息压缩及推送等功能，提高了传输效率。

1. 头信息压缩。在HTTP1.1中，每一次发送请求和返回请求，HTTP头信息都必须进行完整的发送和返回，这一部分头信息中有很多的内容(比如： Headers、 Content–type、 Accept 等字段)是以字符串形式保存的，占用了较大的带宽量。HTTP2则对头信息进行了压缩，可以有效地减少带宽。
2. 推送功能。在HTTP2之前，只能由客户端发送数据，服务器端返回数据。客户端是主动方，服务器端永远是被动方。而在HTTP2中有了“推送”的概念，即服务器端可以主动向客户端发起一些数据传输。

当客户端请求一个包含 index.html、 style.css、1.png文件的Web网页时， style.css文件是以链接的形式在HTML文档中显示的。只有在通过浏览器解析了HTML文档中的内容之后，才能根据链接中包含的URL地址去请求对应的CSS文件。

在HTTP2中有了推送功能之后，不仅客户端可以请求HTML文档，服务器端也可以主动把HTML文档中所引用到的CSS和JS等文件主动推送给客户端。这样HTML、CSS和JS文件的 发送就是并行的，而不是串行的。这样就显著地提升了整体的传输效率和性能。

8. Web 应用程序的组成

Web应用程序负责调用动态语言的解释引擎负责处理“动态内容”,一般由处理器(handler)和模板引擎( template engine)组成：

8.1 处理器

在 Web 应用程序中，处理器是最核心的部分，它负责把客户端发送过来的 HTTP 请求进行接收并处理。在处理过程中会优先调用模板引擎，然后将模板引擎生成的 HTML 文档通过 HTTP 协议返给客户端。

通常情况下，处理器会接收HTTP请求，然后解析路由( Route ),最后将URL映射到对应的控制器(Controller)中。

控制器也可以访问数据库。但一般情况下与数据库相关的逻辑会被单独定义在模型(Model) 中。视图(View)会将模板引擎生成的HTML文档通过HTTP协议返回给客户端。这就是我们在编写应用程序时经常使用的“模型-视图-控制器”( Model-Controller-View，MVC)模式。

MVC模式是软件工程中的一种常用软件架构模式，它把软件系统分为3个基本部分：模型 (Model)、视图(View)和控制器( Controller)：

• 模型(Model):用于处理与应用程序业务逻辑相关的数据，以及封装对数据的处理方法。模型有对数据直接访问的权力，例如对数据库的访问。
• 视图(View):能够实现数据有目的的显示(理论上这不是必需的)。在视图中一般没有程序的逻辑。
• 控制器(Controller):起到组织不同层面间的作用，用于控制应用程序的流程。它处理事件并做出响应。“事件”包括用户的请求处理和与模型的交互。

MVC 模式中三者的关系如下图所示：

MVC模式只是一种长期编程经验的总结，并不是唯一的模式，具体的应用程序该怎么办需要根据具体的场景来架构。

8.2 模板引擎

模板引擎是为了使用户界面与业务数据(内容)分离而产生的，它可以生成特定格式的文档，用于将模板( template)和数据(data)组合在一起，最终生成HTML文档。

HTML 文档会通过 HTTP 响应报文发送给客户端。

模板引擎的实现方式有很多，最简单的是“置换型”模板引擎。这类模板引擎只是将指定模板内容(字符串)中的特定标记(子字符串)替换一下，便生成最终需要的业务数据(比如网页) 。

“置换型”模板引擎实现简单，但其效率低下无法满足高负载的应用程序需求(比如有海量访问的网站)。因此，还出现了“解释型”模板引擎和“编译型”模板引擎等。

模板引擎可以让(网站)程序实现界面与数据分离业务代码与逻辑代码的分离，这就大大提升了开发效率。良好的设计使得代码重用变得更加容易，使得前端页面与逻辑代码(业务数据)不再混合，便于阅读和修改错误。

用 Go 语言实现的一个最简单的 Web 服务器

对 Go 语言不了解的可以跳过代码

package main

import (
	"fmt"
	"net/http"
)

func hello (w http.ResponseWriter, r *http.Request) {
	_, err := fmt.Fprintf(w, "Hello World")
	if err != nil {
		return
	}
}

func main() {
	server := &http.Server{
		Addr: "0.0.0.0:80",
	}
	http.HandleFunc("/", hello)
	err := server.ListenAndServe()
	if err != nil {
		return
	}
}

运行之后，在浏览器输入 127.0.0.1 即可看到 Hello World 。