RESTful API 是现代 Web 应用中非常重要的组件之一，它使用 HTTP 协议来完成客户端和服务器之间的交互。在使用 RESTful API 时，经常会遇到 401 Unauthorized 错误。本文将介绍 RESTful API 中 401 Unauthorized 错误的原因和解决方法，并提供示例代码。
401 Unauthorized 错误的原因
401 Unauthorized 错误表示客户端尝试访问需要身份验证的资源或操作时出现了身份验证失败的情况。这可能是因为客户端没有提供有效的身份验证令牌或者提供的令牌已经过期或被撤销。
在 RESTful API 中，常用的身份验证机制包括基本认证、摘要认证、BASIC-JWT 认证、TOKEN 认证等。其中，TOKEN 认证是最常用的方式。
解决 401 Unauthorized 错误的方法
1. 检查请求头中的令牌是否正确
在 RESTful API 中，客户端通过请求头（Headers）中的 Authorization 字段来传递身份验证令牌。请求头的格式通常是：
-------------- ------ -------
其中， 表示身份验证令牌。
如果客户端提供的令牌无效，服务端将返回 401 错误。因此，当出现 401 Unauthorized 错误时，首先需要检查请求头中的令牌是否正确，如果不正确，则需要将令牌调整为正确的格式并重新发送请求。
2. 检查令牌是否已经过期
令牌通常会在一定时间后过期。在客户端获取到令牌后，需要将令牌保存在本地。每次发送请求时，需要检查令牌是否过期。
如果令牌已经过期，客户端需要重新获取令牌并将新令牌保存在本地。这可以使用认证服务器提供的 API 来完成。例如，在 JavaScript 中，可以使用 Axios 框架发送 POST 请求，获取新的令牌：
----------------------- - --------- ------- --------- ----- ---------------- -- - ----- -------- - -------------------- -- --------- --
3. 检查服务端是否正确配置 CORS
如果服务端没有正确配置 CORS（跨域资源共享），客户端可能会因为无法访问响应的资源而收到 401 Unauthorized 错误。
CORS 是一种 HTTP 头部机制，它允许 Web 应用服务器给 Web 浏览器添加访问权限控制。CORS 通常使用以下 HTTP 头部：
---------------------------- - ----------------------------- ---- ---- ----- ------ ----------------------------- -------------
其中，Access-Control-Allow-Origin 表示哪些源可以访问资源。在测试阶段可以将其设置为 *。但是在实际部署中，应该将其设置为客户端的域名。
Access-Control-Allow-Methods 表示服务端允许通过的 HTTP 方法，例如 GET、PUT、POST、DELETE 等。如果不设置该头部，浏览器将默认禁止客户端使用 PUT 或 DELETE 方法。
Access-Control-Allow-Headers 表示客户端可以使用的自定义头部（例如 Authorization）。如果客户端需要在请求头中添加自定义头部，服务端需要在此处将其添加至白名单。
4. 检查服务端响应是否正确
服务端在发送响应时，会返回一个状态码和一个 JSON 响应体。如果服务端返回的 JSON 格式有误或者没有携带必要的字段，客户端可能会因为无法解析响应体而收到 401 Unauthorized 错误。
因此，在出现 401 Unauthorized 错误时，我们需要首先检查服务端响应的 JSON 格式是否正确，并确认是否返回了必要的字段。以下是服务端正确的 JSON 响应格式：
- --------- ---------- ------- -- -
其中，status 表示响应的状态（可以是 success 或者 error），data 表示响应的内容。如果响应状态是 error，则通常还会包含一个 message 字段，表示错误信息。例如：
- --------- -------- ---------- --------------- ------- -
示例代码
以下是一个基于 Axios 实现的 RESTful API 客户端示例代码，可以用来解决 401 Unauthorized 错误：
------ ----- ---- --------
----- --- - --------------
-------- ---------------------------
-------- ----
---
----- ------------ - -- -- -
------ ----------------------------------
--
----------------------------------- -- -
----- --------- - ---------------
-- ----------- -
---------------------------- - ------- --------------
-
------ -------
---
-------------------------------------- -- -
------ --------------
-- ----- -- -
-- ---------------------- --- ---- -
-- -- --- ------------ --
----- --------------- - -------------
------ ----------------------- -
--------- -------
--------- -----
---------------- -- -
----- ------------ - --------------------
--------------------------------- --------------
------------------------------------- - ------- -----------------
------ -----------------------
---
-
------ ----------------------
---
------ ------- ----此代码示例实现了以下功能：
- 每次请求时，向请求头添加 Authorization 字段并传递令牌。
- 拦截 401 Unauthorized 错误，并请求新的令牌。
- 将新令牌保存在本地并重新发送原始请求。
- 重复步骤 1。
总结
在使用 RESTful API 时，出现 401 Unauthorized 错误是非常常见的情况。本文介绍了出现此错误的原因和解决方法，并提供了示例代码。通过理解并掌握这些方法，我们可以更好地使用 RESTful API 并更好地处理错误。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/653381c47d4982a6eb70f35b