理解网页开发

开发网络意味着使用超文本传输协议（HTTP）进行开发，因此我们将首先回顾这一重要的基础技术。

理解超文本传输协议

要与网络服务器通信，客户端，也称为用户代理，通过网络使用 HTTP 进行调用。因此，HTTP 是网络的技术基础。因此，当我们谈论网站和网络服务时，我们指的是它们使用 HTTP 在客户端（通常是网络浏览器）和服务器之间进行通信。

客户端向一个资源（例如一个页面）发出 HTTP 请求，该资源通过 URL 唯一标识，服务器则返回 HTTP 响应，如图 12.5 所示：

您可以使用 Google Chrome 和其他浏览器来记录请求和响应。

良好实践：谷歌 Chrome 目前被全球约三分之二的网站访客使用，并且它拥有强大的内置开发者工具，因此它是尝试您网站的良好首选。使用 Chrome 以及至少两个其他浏览器（例如，Firefox 和 macOS 及 iPhone 的 Safari）来测试您的网站。微软 Edge 在 2019 年从使用微软自己的渲染引擎切换到使用 Chromium，因此尝试它的重要性降低，尽管有人说 Edge 拥有最好的开发者工具。如果使用微软的 Internet Explorer，通常主要是在组织内部用于内部网。

理解 URL 的组成部分

一个 URL 由几个组成部分构成：

方案： http （明文）或 https （加密）。
域名：对于生产网站或服务，顶级域名（TLD）可能是 example.com 。您可能有子域名，例如 www 、 jobs 或 extranet 。在开发过程中，您通常使用 localhost 作为所有网站和服务的域名。
端口号：对于生产网站或服务，使用 80 用于 http ，使用 443 用于 https 。这些端口号通常是从方案中推断出来的。在开发过程中，通常使用其他端口号，例如 5000 、 5001 等，以区分所有使用共享域名 localhost 的网站和服务。
路径：资源的相对路径，例如， /customers/germany 。
查询字符串：传递参数值的一种方式，例如， ?country=Germany&searchtext=shoes 。
片段：使用其 id 引用网页上的一个元素，例如 #toc 。

URL 是统一资源标识符（URI）的一个子集。URL 指定了资源的位置以及如何获取它。URI 通过 URL 或 URN（统一资源名称）来识别资源。

使用谷歌浏览器发起 HTTP 请求

让我们探索如何使用 Google Chrome 发起 HTTP 请求：

启动 Google Chrome。
导航到更多工具 | 开发者工具。
点击网络标签，Chrome 应立即开始记录您的浏览器与任何网络服务器之间的网络流量（注意红色圆圈），如图 12.6 所示：

在 Chrome 的地址栏中，输入微软学习 ASP.NET 的网站地址，以下是该 URL：

https://dotnet.microsoft.com/en-us/learn/aspnet

在开发者工具中，在记录请求的列表中，滚动到顶部并点击第一个条目，即类型为文档的行，如图 12.7 所示：

在右侧，点击“Headers”标签，您将看到有关请求头和响应头的详细信息，如图 12.8 所示：

请注意以下方面：

请求方法是 GET 。您可以在此处看到的其他 HTTP 方法包括 POST 、 PUT 、 DELETE 、 HEAD 和 PATCH 。
状态码是 200 OK。这意味着服务器找到了浏览器请求的资源，并已在响应的主体中返回。您可能在对 GET 请求的响应中看到的其他状态码包括 301 Moved Permanently 、 400 Bad Request 、 401 Unauthorized 和 404 Not Found 。
浏览器发送给 web 服务器的请求头包括：accept ，它列出了浏览器接受的格式。在这种情况下，浏览器表示它理解 HTML、XHTML、XML 和一些图像格式，但它会接受所有其他文件（ */* ）。默认权重，也称为质量值，是 1.0 。XML 的质量值为 0.9 ，因此它不如 HTML 或 XHTML 更可取。所有其他文件类型的质量值为 0.8 ，因此是最不受欢迎的。accept-encoding ，列出了浏览器理解的压缩算法——在这种情况下，GZIP、DEFLATE 和 Brotli。accept-language ，它列出了内容希望使用的人类语言——在这种情况下是美国英语，其默认质量值为 1.0 ；任何英语方言，其明确指定的质量值为 0.9 ；然后是任何瑞典语方言，其明确指定的质量值为 0.8 。
响应头（ content-encoding) ，这告诉我服务器已发送回使用 gzip 算法压缩的 HTML 网页响应，因为它知道客户端可以解压缩该格式。（在图 12.8 中看不到这一点，因为没有足够的空间来扩展响应头部分。）

关闭 Chrome。

理解客户端网页开发技术

在构建网站时，开发人员需要了解的不仅仅是 C#和.NET。在客户端（即在网页浏览器中），您将使用以下技术的组合：

HTML5：这用于网页的内容和结构。
CSS3：这用于应用于网页元素的样式。
JavaScript：这用于在网页上编写任何所需的业务逻辑，例如，验证表单输入或调用网络服务以获取网页所需的更多数据。

尽管 HTML5、CSS3 和 JavaScript 是前端网页开发的基本组成部分，但还有许多其他技术可以使前端网页开发更加高效，包括：

Bootstrap，全球最受欢迎的前端开源工具包
SASS 和 LESS，样式的 CSS 预处理器
微软的 TypeScript 语言用于编写更强健的代码
JavaScript 库，如 Angular、jQuery、React 和 Vue

所有这些高级技术最终都会转换或编译为基础的三种核心技术，因此它们可以在所有现代浏览器中运行。

作为构建和部署过程的一部分，您可能会使用以下技术：

Node.js，一个用于使用 JavaScript 进行服务器端开发的框架
节点包管理器（npm）和 Yarn，都是客户端包管理器
webpack，一个流行的模块打包工具，用于编译、转换和打包网站源文件