https://datatracker.ietf.org/doc/html/rfc7231#section-6.1

一、4XX - 客户端错误

400 Bad Request
401 Unauthorized
414 Request-URI Too Large
403 Forbidden
404 Not Found
405 Method Not Allowed

409 Conflict

image.png

二、5XX - 服务端错误

500 Internal Server Error
502 Bad Gateway
503 Service Unavailable
504 Gateway Time-out

三、3XX - 重定向

重定向状态码是服务器告诉客户端，它们访问的资源已被移动
① 服务器发送一个重定向状态码和一个可选的Location Header, 告诉客户端新的资源地址在哪。
② 客户端会自动用Location中提供的地址，重新发送新的Request。
③ 这个过程对用户来说是透明的。

301 (Moved Permanently )

资源已被永久移动到由location头部指定的URL上
永久重定向

① Response中应该包含一个 Location URL, 说明资源现在所处的位置，客户端会使用Location中给出的URL，重新发送新的HTTP request 。

② 浏览器在收到 301 响应之后，从 Location 里面获取到了新的地址，并发起了新的请求。但是，这个新的请求使用的是 GET 方法而非我们原来的 POST 方法，Request Body 也丢失了。

308（Permanent Redirect）

与301的区别就是浏览器不会改变请求的 HTTP Method 和 Request Body
永久重定向

302（Found）/ 303（See Other）

临时重定向
浏览器在收到 303 响应之后，除 GET 方法保持不变之外，其他所有方法都会被改为 GET 方法，同时 Request Body 也会丢失。大多数浏览器会将 302 请求视为 303 请求

image.png image.png

应用场景举例：

通常图片资源会放到类似 S3 这样的静态资源服务器，出于对隐私和安全的考虑，我们有时不能直接通过静态资源服务器的 URL 访问到这个图片，而是需要后端通过身份凭证去 S3 签发一个临时地址（这个地址用一次就失效了，下一次需要重新签发），然后我们才能通过这个临时地址访问到真正的图片资源。

对于这个场景，302/303 就非常有用了。比如，前端可以使用一个固定的 URL 来访问图片资源 (<img src="/image/foo.jpg")，这个 URL 由后端提供，后端在生成完临时地址之后，可以直接通过 302/303 重定向到这个新的地址，接下来浏览器会再次发起请求，获取新地址指向的这个图片资源。

307（Temporary Redirect）

临时重定向
与303的区别是浏览器不会改变请求的 HTTP Method 和 Request Body

image.png
image.png
image.png

重定向与转发

-
重定向.png -	转发.png
重定向：返回3**状态码+location响应头；浏览器再次访问location提供的URL	转发：当次Http请求，直接获取要转发的URL地址并返回

window.location + 3XX 响应

一般来说文档加载/重新加载都会产生一个 Document 类型的请求

如果是通过 fetch/XMLHttpRequest 调用所获取到的 3XX 响应，浏览器是不会改变当前地址栏的 URL 并跳转的

应用场景：

1. 第三方授权
   在使用 OAuth2 鉴权时（比如微信登录），可以通过 window.location 重定向到自己服务器的授权地址（支持多个平台登录时，可以由后端统一处理），然后服务器会生成一个三方授权点的地址，并通过 302 响应告知给浏览器，浏览器在收到响应之后会跳转到这个三方授权点的 URL（微信登录页），完成授权之后，三方授权页面会通过 window.location 再重定向回我们自己的页面。
   通过 window.location 再配合 302 响应，我们可以快速将用户导向三方授权点，不需要加载任何 JS，非常快速方便。

2. 重构后
   比如某个应用进行了整站重构，重构之后 URL 发生了改变，这时候可以考虑将老 URL 重定向到新 URL。

四、2XX

206 Partial Content 部分内容

请求一个1000字节的文件的前500字节
Content-Length: 500
Content-Range: bytes 0-499/1000

• 下面这个例子实际响应了整个文件

  
  image.png

image.png

204 No Content 无响应体

• 这是一个上传文件的例子

  
  image.png

image.png

五、1XX

100-continue

表示服务端接收到请求的第一部分，正在等待其余部分
想接收到这样的状态码，首先，请求时应该带上请求头：Expect: 100-continue
类似于发送大量数据前先做服务端校验，如果返回100，则继续发送，不是100的话就不发送后续数据了。

六、各种failed原因

企业微信截图_1708243476242.png image.png image.png

net::ERR_NAME_NOT_RESOLVED：浏览器无法解析主机名（网络问题、DNS问题、或主机名不正确）
net::ERR_CONNECTION_TIMED_OUT：浏览器在规定时间内无法与服务端建立连接
net::ERR_CONNECTION_RESET：浏览器尝试与服务器建立连接时连接被中断（可能是防火墙设置问题）
net::ERR_RESPONSE_HEADERS_MULTIPLE_CONTENT_DISPOSITION：服务器在响应头部中设置了多个 Content-Disposition 字段
net::ERR_BLOCKED_BY_CLIENT：表示请求被浏览器拦截（可能是由于安装了某些拦截广告的浏览器插件）