HTTP学习笔记

💡本文为学习HTTP相关知识的学习笔记，如有错误，欢迎大家批评指正！

一、HTTP协议概念

1. HTTP协议：在客户端和服务器之间进行通信的协议，是一种应用层协议，是基于 TCP/IP 通信协议来传递数据的

2. 请求和响应：HTTP通信是基于请求-响应模型的。客户端发送请求到服务器，服务器接收请求并返回响应给客户端。

3. 协议： 为了使数据在网络上从源头到目的，网络通信必须遵循相同的规则，这套规则称为协议，它最终体现为在网络上传输的数据包格式。

4. URI（统一资源标识符）：用于标识和定位资源的字符串。它标识和访问网络资源和非网络资源。

5. URL（统一资源定位符）：是URI的一个特例，用于定位并访问网络资源。它包含了资源的具体位置信息，包括协议类型（如HTTP、FTP）、主机名、路径、查询参数等。例如，http://www.example.com/index.html。

   

二、HTTP协议特点

• 简单：语法和语义都很简单，易于理解和实现。
• 无状态：它不保留之前的请求或会话信息，即每个请求都是完全独立的。
• 支持缓存：可利用缓存机制来减少网络带宽消耗和提高用户体验。
• 可扩展：通过添加自定义的请求头和响应头，可传递额外信息。

三、HTTP报文分析

HTTP报文是HTTP协议中用于交换数据的格式，分为请求报文和响应报文两种。每种报文都包含三个部分：起始行、头部字段和消息体。

（1）请求报文

方法（Method）：

• GET：请求资源。
• HEAD：与GET方法类似，但不返回实际的响应体，仅返回响应头。
• POST：用于提交数据，通常用于表单提交或文件上传。
• PUT：更新（替换）资源。
• DELETE：删除资源。
• OPTIONS：查询服务器支持的通信选项（例如服务器支持哪些请求方法、响应头字段、身份验证等）。
• TRACE：用于对服务器进行回环测试，用于测试或诊断。（它发送一个请求到服务器，然后服务器将该请求返回给客户端，可知道请求在传输过程中是否被修改）
• CONNECT：用于与代理服务器建立隧道连接，通常用于建立安全的HTTPS连接。（好比你在使用代理服务器访问互联网，需要先与代理服务器建立连接，后通过它来访问其他网站）

常用请求头：

• Host：请求的目标主机。
• Accept：客户端能够接受的响应内容的类型。例如：Accept: text/html, application/json，表客户端可接受HTML或JSON格式的数据。
• User-Agent：客户端的用户代理信息，通常是浏览器的名称和版本号。
• Content-Type：请求体中的数据类型。例如Content-Type: application/json表示消息体是JSON格式的数据。
• Cookie：用于保存客户端的状态或偏好。例如Cookie: name=alice; age=18表示客户端发送了两个cookie数据，分别是name和age。
• Cache-Control：表示缓存相关的指令和参数，用于控制缓存的行为和有效期，例如Cache-Control: no-cache, no-store, max-age=0, must-revalidate表示不使用缓存，不存储缓存，并且每次都要向服务器验证缓存是否有效。

（2）响应报文

状态码（Status code）：

表示服务器对客户端请求的处理结果。分别是：

• 1xx：信息类，接收到请求并继续处理。
• 2xx：成功类，请求已被成功接收、理解和接受。
• 3xx：重定向类，需要进一步的操作才能完成请求。
• 4xx：客户端错误类，请求有语法错误或请求无法实现。
• 5xx：服务器错误类，服务器未能实现合法的请求。

每类状态码有相应的信息（Status message），例如：

• 200 OK：请求成功。
• 301 Moved Permanently：永久重定向，所请求资源的 URL 已永久更改。
• 400 Bad Request：客户端请求有语法错误，不能被服务器所理解。
• 403 Forbidden：客户端没有对内容的访问权限。
• 404 Not Found：请求失败，服务器找不到请求的资源。
• 500 Internal Server Error：服务器遇到不知道如何处理的情况。

常用响应头：

• Content-Type：响应体中的数据类型。
• Server：指定服务器的软件类型和版本号。
• Set-Cookie：服务器通过Set-Cookie头，将一个Cookie发送给客户端，客户端会保存该Cookie，并在后续的请求中发送回服务器。
• Location：指定重定向的目标URL。
• Cache-Control：表示缓存相关的指令和参数，用于控制缓存的行为和有效期。

（3）RESTful API

是一种基于HTTP协议的API设计风格，它遵循REST原则（它强调资源的标识、表述和链接）。RESTful API利用HTTP协议中的方法、状态码、URI等元素来实现对资源的统一和规范的操作。

• 用URI标识资源，一个 URI 代表一种资源；
• 在客户端和服务器之间，资源有统一的表述（表述可以类比为商品的详细信息）；
• 客户端通过 method 对服务器端资源进行操作，实现 " 表现层状态转化 " 。
• 用状态码表示操作的结果，例200表示成功，201表示创建成功，204表示删除成功，400表示请求错误，404表示资源不存在等。

​ 例：

​ GET http://localhost:8080/admin/user （查询用户）

​ POST http://localhost:8080/admin/user （新增用户）

​ PUT http://localhost:8080/admin/user （更新用户）

​ DELETE http://localhost:8080/admin/user （删除用户）

（4）缓存以及cookie

四、HTTP常用场景

1. 静态资源

静态资源指，无需服务器动态生成或处理的资源，例如网页、图片、样式表、脚本等。静态资源通常使用缓存机制来提高性能和用户体验。

以今日头条网站为例，访问https://www.toutiao.com/时，浏览器会向服务器请求该网页的HTML内容，并根据HTML中的引用，再向服务器请求其他的静态资源，例如CSS、JS、图片等。

• Accept: text/css,*/*;q=0.1表示期望收到CSS格式的数据。
• Content-Type: text/css表示响应体是CSS格式的数据；
• Cache-Control: max-age=31536000表示该资源可缓存一年；
• access-control-allow-origin: *表示允许所有域名访问；
• Last-Modified: Wed, 21 Aug 2023 07:28:00 GMT：表示资源最后修改于2023年8月21日；
• ETag: "5d8c72a5edda8"：表示资源的标识符是5d8c72a5edda8。（ETag表示资源的唯一标识符）
• 响应状态码为200表示请求成功。

2.静态资源方案

1. 缓存：静态资源在首次请求时可以被缓存到浏览器或代理服务器上，当再次请求相同资源时，可以直接从缓存中获取，从而减少了网络请求和服务器负载。
2. CDN（内容分发网络）：CDN是一种分布式系统，将内容缓存在全球各地的服务器节点上，使用户可以从最近的服务器节点获取资源。
3. 文件名哈希：将静态资源的文件名进行哈希处理。当资源内容发生变化时，文件名的哈希值也会随之改变。通过使用文件名哈希，可以保证用户每次访问都能获取到最新的资源。

3.登录

指用户通过输入用户名和密码或其他方式，来验证身份并访问受限制的资源或服务。登录通常使用POST方法来提交用户信息，并使用Cookie或Token等机制来保存用户状态。登录还涉及到跨域问题、表单登录（form login）、扫码登录（scan code login）、SSO登录（single sign-on login）等。

（1）表单登录

以今日头条网站为例，点击登录按钮时，浏览器会向服务器请求一个登录页面，该页面包含了一个表单，让用户输入手机号和验证码。该表单使用POST方法向https://sso.toutiao.com/login/提交用户信息，并设置了一个隐藏字段service为https://www.toutiao.com/表示登录成功后要跳转到的目标页面。

• Content-Type: application/x-www-form-urlencoded：表示消息体是表单格式的数据；
• Cookie: csrftoken=xxxxxx; tt_webid=yyyyyy表示客户端发送了两个Cookie数据，分别是csrftoken和tt_webid。
• mobile=13888888888&code=123456&service=https%3A%2F%2Fwww.toutiao.com%2F&csrfmiddlewaretoken=xxxxxx：表示用户输入了手机号、验证码、目标页面和csrf令牌。

（2）扫码登录

即用户通过扫描二维码，在手机上确认登录，无需输入信息。

原理：服务器生成一个唯一的标识符和对应的二维码，用户使用手机扫描并在手机上确认登录；服务器检测到用户的确认后，将用户信息返回给浏览器，并完成登录。

（3）SSO登录

即用户通过一个统一的认证中心来登录多个应用或服务，无需重复输入信息。

原理：用户访问一个应用或服务时，若没有登录，则跳转到认证中心；在认证中心输入用户名和密码或其他方式进行认证；认证中心验证用户身份后，生成一个令牌并返回给用户；用户携带该令牌访问其他应用或服务时，无需再次登录。

4.跨域问题

是指在浏览器上进行网络通信时，由于浏览器的同源策略限制，导致不同源的网页之间，请求受到限制，无法进行正常的跨域通信。不同源指网页的协议、域名或端口有任何一个不相同，例如http://a.com和https://a.com就是不同源，因为它们协议不同。

解决跨域的方法：

1. JSONP（JSON with Padding）

   JSONP利用了script标签的src属性不受同源策略限制的特点（因为script标签可以加载任何来源的脚本），通过创建script标签，将跨域请求的数据包装为回调函数的参数，从而实现跨域数据的获取。缺点是只能发送GET请求，不能发送POST或其他请求。

   比方说，你在自己的网站上需要获取一个其他域名的数据，可以通过JSONP技术，在页面中添加一个script标签，设置其src属性为跨域数据的URL，并指定一个回调函数，服务器返回的数据将作为回调函数的参数传入。

2. CORS（跨域资源共享）

   CORS通过在HTTP头部中添加特定的字段，服务器可告知哪些来源的客户端可以访问哪些资源，并且可以控制是否允许携带Cookie等信息。客户端在发送请求时会附带一个Origin字段，表示请求的来源，服务器根据该字段来判断是否允许跨域访问，并在响应头中返回一个Access-Control-Allow-Origin字段，表示允许访问的来源。

3. 代理服务器

   是一种利用服务器端来转发客户端和目标服务器之间的请求和响应的技术，可绕过浏览器的跨域限制。因为对于浏览器来说，它只和代理服务器进行通信。

   代理可以使用一些工具或软件来实现，例如http-proxy、nginx、Apache等，在vue开发项目中，可以通过修改vue.config.js来进行配置代理服务器。代理的缺点是需要额外的服务器资源和配置。

本文参考链接：

总结：HTTP指南！以及相关的实践分析与代码分析（个人总结与课程笔记结合体） | 青训营

HTTP 概述 - HTTP |多核