5497 字

27 分钟

【WEB】WEB基本要素

2023-03-12

学习笔记/Web技术

web

前言#

本章介绍一些简单的 web 基本要素，例如基本 Internet 协议、超文本传输协议、HTTP 请求与响应以及 WEB 客户端和服务器。主要以介绍概念为主，了解就好。

因特网与万维网#

Internet 是在一个通信网络中连接的计算机的大规模集合。计算机通信协议（communication protocol）是两台计算机如何通信的详细规范，它们被执行以服务于某种目的。

Internet 协议#

TCP/IP#

传输控制协议（Transmission Control Protocol/Internet Protocol， TCP/IP）是计算机网络连接的标准协议。它允许某台计算机中的程序通过 Internet 直接和另一台计算机中的程序进行通信。

其中，IP 和 TCP 是两个不同的协议，我们先从 IP 协议说起。

对于我们来说，Internet 节点是通过名称进行标识的；而对于计算机来说，它们是通过数字地址进行标识的。这种机制类似于程序中的变量名和变量的数字内存地址之间的关系。我们是通过变量名来标识变量，计算机则是通过变量的数字形式的内存地址来标识变量。IP 是一个地址，代表了互联网中计算机的识别变量。

计算机接入到 Internet 的 IP 地址是一个唯一的 32 位数字（IPv4）或 128 位数字（IPv6）。这里主要介绍 IPv4，为了方便人类阅读和分析，它通常被写作点分十进制的形式，即四个字节被分开用十进制写出，中间用点分隔。

例如：

192.0.2.235（内网保留地址）
120.253.255.97（公网地址）

一些 IP 地址被保留作专用地址（内网等），例如 192.168.x.x；部分 IP 地址连接了全球互联网（公网），例如 120.253.255.97。

我们通过 IP 地址，可以在互联网中访问一个云端内容之类的。

TCP（Transmission Control Protocol，传输控制协议）是一种更高级的协议，它扩展了 IP 以提供额外的功能，保证数据传输的可靠性和完整性。TCP 协议通常用于客户端和服务器之间的通信，例如 Web 浏览器与 Web 服务器之间的通信，电子邮件客户端与邮件服务器之间的通信等。

TCP 添加到 IP 中的一个重要特性是端口（port）。端口允许使用 TCP 与一台机器上许多不同的应用程序通信。

例如：SSH 协议的端口号是 22，我们可以通过 22 端口使用 SSH 登入主机；同时 HTTP 协议的默认端口为 80，我们可以通过 80 端口访问 HTTP。假设我们的 IP 为 1.2.3.4，则我们访问 1.2.3.4:22 与 1.2.3.4:80 是不一样的效果，它允许这个 IP 上许多不同的应用程序通信。

UDP#

UDP 是一种计算机网络传输协议，全称为用户数据报协议（User Datagram Protocol）。它是一种简单的、无连接的传输层协议。

UDP 为应用程序提供了一种无需建立连接就可以发送封装的 IP 数据包的方法。相比于 TCP，UDP 并不提供可靠性保证，但是可以高速处理简单信息。

UDP 协议主要用于在应用层所需的速度优先于可靠性的场景下，如音视频传输、在线游戏等。由于 UDP 没有建立连接的开销，并且不对数据进行确认应答和重传等操作，因此可以更快地传输数据，但也会存在数据传输丢失或出现乱序等问题。

域名（domain）#

域名是互联网中用于标识和定位计算机或网络服务器的一种名称，通常由多个部分组成，以点号分隔。域名是面向用户的，而 IP 是面向计算机的。用户可以使用易于理解的名称来访问互联网上的任何资源，而不需要记住复杂的 IP 地址。因此，域名是指向 IP 的，在 DNS 中会继续描述。

例如：hoyue.fun 是本站的域名，其中 hoyue 为主机名称，fun 为域名称。由主机名称和域名称组成域名，其中域只有一级时为顶级域名。

而 nav.hoyue.fun 是二级域名，其中 nav 为主机名称，而 hoyue 域是 fun 域的一部分，此时域名称为 hoyue.fun，是个二级域名。

常见顶级域名示例：

.com：商业
.org：非营利组织
.net：网络基础设施
.edu：教育机构
.gov：政府机构

以及部分国家和地区的顶级域名：

.cn：中国
.hk：香港
.mo：澳门
.tw：台湾
.us：美国
.uk：英国
.jp：日本
.ca：加拿大
.au：澳大利亚

DNS#

DNS 是域名系统（Domain Name System）的缩写。它是一种分布式的、层次化的命名系统，用于在互联网上映射主机名和 IP 地址之间的关系。简单来说，DNS 就是将易于记忆的域名转换成对应的 IP 地址。

DNS 系统将 IP 地址与易于理解和记忆的域名建立了映射关系，使得用户可以通过输入域名来访问目标主机，而不需要直接使用 IP 地址。

DNS 系统由多个服务器组成，分为根域名服务器、顶级域名服务器、权威域名服务器和本地域名服务器等层次。当用户输入一个域名时，本地域名服务器会先查找自己的 DNS 缓存，如果没有找到，则向上级域名服务器逐级查询，直到得到目标主机的 IP 地址为止。

当 DNS 系统无法工作时，我们就无法将域名映射到 IP 上，此时我们无法通过域名访问 IP 地址。但是，我们还可以通过直接访问 IP 地址来访问，它不受 DNS 系统影响。

其他高级协议#

我们还有很多高级的协议基于 TCP 和 UDP，在 IANA 注册的常用协议以及其端口如下：

TCP 端口：

21：FTP（文件传输协议）数据传输控制命令
22：SSH（安全外壳协议）远程登录协议
25：SMTP（简单邮件传输协议）用于发送电子邮件
53：DNS（域名系统）查询和响应
80：HTTP（超文本传输协议）Web 服务器默认端口
110：POP3（邮局协议版本 3）接收电子邮件
143：IMAP（因特网消息访问协议）接收邮件协议
443：HTTPS（安全超文本传输协议）Web 服务器加密端口
3389：RDP（远程桌面协议）Windows 系统远程控制

UDP 端口：

53：DNS，DNS 服务查询和响应
67/68：DHCP（动态主机配置协议）客户端和服务器之间的通信
69：TFTP（简单文件传输协议）用于在网络上传输文件
123：NTP（网络时间协议）用于同步计算机的时间
161/162：SNMP（简单网络管理协议）用于监控和管理网络设备

万维网#

万维网（World Wide Web，简称 Web 或 WWW）是一种基于互联网的信息系统，它由一系列互相链接的超文本文档组成，通过互联网传输和共享各种形式的信息，包括文字、图片、视频、音频等。

它与 Internet 的区别是：Internet 是一个底层的基础设施，它提供了计算机之间交换数据和通信的能力；而 Web 是一个基于 Internet 上的应用，它利用 Internet 的基础设施来实现信息的共享和传递。

万维网的核心技术是超文本传输协议（HTTP）和超文本标记语言（HTML），它们使得用户可以轻松地通过浏览器访问各种网站和网页，并且可以通过超链接在不同网页之间跳转。此外，Web 还使用了其他技术，例如 JavaScript、CSS、XML、Ajax 等，用于实现各种功能和增强用户体验。

超文本传输协议#

超文本传输协议（Hypertext Transfer Protocol，HTTP）是用于从万维网传输超文本到浏览器的传输协议。它详细规定了 Web 客户与服务器之间应该如何通信。

所谓超文本，它可以通过链接将有关联的文本、图像、声音、视频等多媒体元素相连，形成一种分层、非线性的信息结构。

HTTP 协议使用客户端-服务器模型，客户端发送请求，服务器返回响应（或请求-响应模型）。

它的工作流程可以简单概括为以下几个步骤：

客户端向服务器发送 HTTP 请求，请求中包含 URL 地址、请求方法、头部信息等内容。
服务器接收到请求后，解析请求内容，根据请求内容生成响应数据，并将其发送回客户端。
客户端接收到响应后，解析响应内容，根据响应结果进行相应处理，例如显示网页、下载文件等。

接下来我们来具体学习 HTTP 的请求与响应。

HTTP 请求#

HTTP 请求的通用格式如下所示：

1
<method> <request-URI> <HTTP-version>
2
<headers>
3
<entity-body>

其中，<method> 指明 HTTP 请求使用的方法，例如 GET、POST 等，<request-URI> 是请求的统一资源标识符，指明了请求要访问哪个资源，<HTTP-version> 指定所使用的 HTTP 协议版本。<headers> 部分包含了请求头信息，用于传递各种参数和元数据。最后，<entity-body> 表示请求体，它包含了客户端提交的实际数据，例如表单数据、文件内容等。

HTTP 请求方法#

HTTP 请求的常见方法：

GET：用于获取资源，通常用于查询数据或者从服务器上下载文件。
POST：用于向服务器提交数据，在服务器端创建或更新资源。通常用于提交表单数据、上传文件等操作。
PUT：用于向服务器更新资源。PUT 方法和 POST 方法类似，但是 PUT 方法要求客户端提供更新后整个资源的内容，而不是仅仅提供更新的部分信息。
DELETE：用于删除服务器上的资源。
HEAD：与 GET 方法类似，但是不返回请求的资源，只返回响应头部信息。

GET 和 POST 是最常用的两个方法。

URL#

URL 是 Uniform Resource Locator（统一资源定位器）的缩写。它是用于指定互联网上资源位置的标准方式，常用于在浏览器中访问网站、下载文件等操作。在 HTTP 中 URL 是定位资源的标识。

URL 由多个部分组成，有：

协议：指明了客户端与服务器之间通信所使用的协议，如 http、https、ftp 等。
主机名（或 IP 地址）：指定了服务器的地址。
端口号：指定了客户端与服务器之间通信所使用的端口号，如果没有指定则默认为 80（http）或 443（https）。
路径：指定了要请求的资源在服务器上的位置。
查询参数：用于向服务器传递额外的信息，以便服务器根据这些信息返回不同的结果。

例如：http://www.example.org:56789/a/b/c.txt?t=win&s=chess#para5

协议：HTTP
主机名：www.example.org
端口号：56789
路径：/a/b/c.txt
查询参数：?t=win&s=chess#para5 其中查询命令为 t、s，参数为 win、chess 和 #para5

HTTP 版本#

HTTP 版本逐步迭代，这部分不是重点，学习笔记主要以 HTTP/1.1 版本为例。目前最新 HTTP 版本为 3.0。

请求头#

HTTP 通信的首行之后是任意数目的头部字段，称为请求头。头部字段的格式是由字段名称和字段值构成的，字段名称和字段值之间使用冒号隔开。

以下为常见的请求头，除了 Host 外在 HTTP/1.1 中无法省略外，其他大多是可选的：

Host：指定服务器的主机名和端口号。格式为：HOST: hostname:port，其中 HOST 字段不必全部大写。
Accept：指定客户端能够接收的数据类型，用于告诉服务器返回何种格式的资源。
User-Agent：浏览器或客户端的身份标识，用于告诉服务器请求来源的类型和版本号。
Referer：表示当前请求是从哪个页面跳转过来的，用于记录请求的来源。
Content-Type：指定请求中包含的实体的 MIME 类型，例如提交表单数据时使用的 application/x-www-form-urlencoded、上传文件时使用的 multipart/form-data 等。
Authorization：用于在请求中传递用户凭证信息，通常用于进行身份验证。
Cookie：用于在客户端和服务器之间传递会话信息，记录用户的登录状态等。
Connection：控制是否使用持久连接，即保持 TCP 连接开启状态，以便在同一连接上发送多个请求。
Cache-Control：设置缓存策略，控制浏览器如何缓存资源。

Accept 请求头#

Accept 请求头用于告诉服务器客户端能够接受哪些 MIME 类型的资源。

MIME 是 Multipurpose Internet Mail Extensions（多用途互联网邮件扩展）的缩写，它是一种标准化的互联网数据格式，用于表示不同类型的文件和数据。MIME 类型通常以“主类型/子类型”的形式命名，如 text/html、image/jpeg 等。

如果服务器返回的响应类型与客户端指定的 MIME 类型不匹配，则客户端可能会拒绝接受该响应或者进行其他处理，例如将响应用于下载而非直接在浏览器中渲染。

它的常见格式如下：

1
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8

Accept 后接 MIME 资源类型，分号后接优先级，用 q=n 表示，用于指定客户端对不同类型资源的偏好程度，权重值越高表示偏好程度越高。权重值范围是 0~1，默认为 1，越靠近 1 优先级越高。通配符“*”可以表示任意类型。

Accept 请求头中常见的 MIME 类型及其默认优先级如下：

text/html：用于表示 HTML 文档，通常是 Web 浏览器中最常见的 MIME 类型，优先级很高。
application/json：用于表示 JSON 格式的数据，通常用于 Web API 和前后端数据交互，优先级较高。
application/xml：用于表示 XML 格式的数据，通常用于数据交换和 Web 服务，优先级较高。
image/jpeg、image/png、image/gif：用于表示图像文件，分别对应 JPEG、PNG 和 GIF 三种格式，优先级较高。
application/javascript、text/javascript：用于表示 JavaScript 代码，优先级较高。
application/pdf：用于表示 PDF 文件，通常用于文档共享、存档等场景，优先级较高。
text/css：用于表示 CSS 样式表，通常用于网页布局和视觉效果，优先级较高。
application/octet-stream：用于表示二进制流数据，优先级较低。
application/msword、application/vnd.openxmlformats-officedocument.wordprocessingml.document：用于表示 Word 文档，优先级较低。
application/zip：用于表示压缩文件，通常用于批量下载和上传，优先级较低。

简单 HTTP 请求例子#

我们知道了 HTTP 请求的各个部分的格式，于是就可以写一些简单的 HTTP 请求了。下面是一个简单的 HTTP 请求的例子（从连接开始，以 telnet 协议为例，它的基本格式为 telnet <服务器地址> <端口号>）：

1
telnet hoyue.fun 80

我们建立了一个与 hoyue.fun 的 80 端口的连接，接下来就是发送 HTTP 请求命令：

1
GET /profile/index.html HTTP/1.1
2
Host: hoyue.fun

使用 GET 方法，请求 http://hoyue.fun/profile/index.html 的资源，HTTP 版本为 1.1。请求头中指定了 Host 为 hoyue.fun。

注意：如果在 Windows 系统中没有 Telnet 命令，因为 Windows 系统默认关闭了 Telnet 功能，我们需要在系统的设置中搜索“Windows 功能”，找到里面的 telnet 客户端，勾上确定等待一会即启用了 Telnet。

Windows 带有的 Telnet 可能默认为不可视页面。我们在已经打下 Telnet 命令后，可以同时按下键盘 CTRL 键和 ] 键（反中/大括号键），出现 Telnet 提示后再回车进入可视化输入状态。此时是一个空白页面，可以在这里输入 HTTP 请求，输入结束后回车两次即可发送请求。

HTTP 响应#

HTTP 响应的通用格式如下：

1
HTTP/1.1 <状态码> <状态文本>
2
<响应头部字段>
3
<响应正文>

其中，各个部分的含义如下：

HTTP/1.1：指定 HTTP 协议的版本号。
状态码：一个三位数的数字，用于表示服务器对请求的处理结果。常见的状态码有 200、404、500 等。
状态文本：用于描述状态码的简短文本，与状态码一起构成了 HTTP 响应的第一行。
响应头部字段：用于传递与响应相关的附加信息，例如 Content-Type、Content-Length、Cache-Control 等。
响应正文：包含了服务器返回给客户端的实际数据，可以是 HTML 网页、JSON 数据、图片文件等类型的数据。

状态码与状态文本#

HTTP 状态码用于表示服务器对请求的处理结果，常见的状态码有以下几种：

1xx（信息性状态码）：表示服务器已经接收到了请求，并且正在处理。例如，100 表示继续、101 表示正在切换协议。
2xx（成功状态码）：表示请求已经被成功处理。例如，200 表示 OK、201 表示已创建、204 表示无内容。
3xx（重定向状态码）：表示客户端需要采取进一步的操作才能完成请求。例如，301 表示永久重定向、302 表示临时重定向、304 表示未修改。
4xx（客户端错误状态码）：表示客户端提交的请求有误或者无法被处理。例如，400 表示错误请求、401 表示未授权、404 表示未找到资源、403 表示禁止访问。
5xx（服务器错误状态码）：表示服务器在处理请求时发生了错误。例如，500 表示服务器内部错误、503 表示服务不可用、502 表示网关错误。

状态文本是指状态码对应的内容，例如常见的有：

200：OK
401：Unauthorized
403：Forbidden
404：Not Found
500：Internal Server Error
503：Service Unavailable

HTTP 响应的第一行由 HTTP版本响应码相应文本 构成。例如：HTTP/1.1 200 OK

响应头部字段#

HTTP 响应中的头部字段用于传递与响应相关的附加信息。这些头部字段可以帮助客户端和服务器更好地处理和解析响应内容，提高 Web 应用程序的可靠性和性能。常见的响应头部字段如下：

Content-Type：指定响应的 MIME 类型，告诉客户端如何解析响应数据；
Content-Length：指定响应正文的长度，用于告知客户端如何接收响应数据；
Server：指定服务器软件的名称和版本号；
Date：指定响应生成的时间；
Last-Modified：指定资源的最后修改时间；
Location：指定重定向目标的 URL；
Cache-Control：指定响应的缓存策略；
Set-Cookie：指定需要在客户端存储的 Cookie 信息；

响应头部之后必须有一个空行，这与请求头部是一致的。空行之后是响应正文，包含了服务器返回给客户端的实际数据。

简单 HTTP 相应例子#

下面是一个简单的 HTTP 相应的例子：

1
HTTP/1.1 200 OK
2
Content-Type: text/html; charset=utf-8
3
Content-Length: 1234
4

5
<html>
6
    <head>
7
        <title>Hello World!</title>
8
    </head>
9
    <body>
10
        <h1>Hello World!</h1>
11
    </body>
12
</html>

该响应的状态码为 200，表示请求成功；Content-Type 和 Content-Length 响应头部字段分别指定了响应正文的 MIME 类型和长度；响应正文是一个 HTML 页面，包含了一个标题和一个 Hello World 的文本。

HTTP/1.1 中的默认操作是当发送动作结束后，服务器和浏览器之间在很短暂的一段时间内仍然保持连接状态。这样，客户端就可以连续发送多个请求而不必重新建立与服务器的连接。

WEB 客户端与服务器#

WEB 客户端#

Web 客户端（web client）是一种通过发送 HTTP 请求消息并处理得到的 HTTP 响应来访问 Web 服务器的软件。Web 浏览器就是最常见的 Web 客户端。

浏览器向服务器请求一个静态文档。服务器接到请求后定位这个文档，然后发送给浏览器，浏览器将文档显示给用户。这只是最基本的，实际上浏览器能做到更复杂的通讯。

WEB 服务器#

Web 服务器是可以向发出请求的浏览器提供文档的程序。

Web 服务器通常运行在专用的硬件设备或者普通的个人电脑、服务器等设备上，用来提供 Web 服务和管理 Web 站点。

Web 服务器的主要功能包括：

接收和解析客户端发来的 HTTP 请求。
处理客户端请求，执行相应的程序或者文件，生成 HTTP 响应。
将 HTTP 响应发送回客户端，完成 HTTP 响应的传输。
管理 Web 站点，包括配置站点属性、维护日志、监控性能等。

常见的 Web 服务器软件包括 Apache、Nginx、IIS、Tomcat 等，它们都提供了丰富的功能和插件，支持多种操作系统和编程语言，可以灵活地满足不同的 Web 应用需求。

Web 服务器是 Web 开发的重要组成部分，它承担了 Web 应用运行的基础架构和数据传输的核心任务，对于 Web 应用的性能、安全性和可靠性具有重要影响。

本次学习将以 Tomcat 为例，基于 NetBeans 软件搭建 Tomcat 服务器，并创建虚拟主机，具体请见专题：

https://hoyue.fun/web_tomcat_starthost.html

后记#

本章介绍了一些简单的 web 基本要素，能帮助我们了解 WEB 技术。

【WEB】WEB基本要素

https://hoyue.fun/web_1.html

作者

Hoyue

发布于

2023-03-12

最后更新于

2023-03-12

许可协议

CC BY-NC-SA 4.0

【算法设计与分析】分治法

【WEB】HTML/XHTML基础