javascript - 为什么登录后所有 XHR 请求中都会显示基本身份验证凭据

Question

我在与网络中的其他 API 服务器结合进行基本身份验证时遇到问题。简单方案:

1. 浏览器向 Nginx 服务器发送 GET 请求
2. Nginx 响应 401
3. 用户发送基本身份验证凭据
4. Nginx 响应为 200。浏览器加载静态文件(CSS + JS)并评估它们。
5. 在 JS 中，可以获取另一个 API(包含 CORS)
6. 但我在对 API 服务器的所有请求中看到带有基本身份验证凭据的 Auth header 。

问题是为什么？这是浏览器的工作方式吗？如果我不控制给定的 JS 文件，如何删除它们？

我正在使用 Nginx 基本身份验证模块，配置非常简单:

location / {
    try_files $uri /index.html;

    auth_basic "Restricted Content";
    auth_basic_user_file /etc/nginx/.htpasswd;
}

Answer 1

问题是为什么？这是浏览器的工作方式吗？

是的，这就是浏览器的工作方式，这是有充分理由的。根据RFC2617 ，对于基本身份验证方案:

A client SHOULD assume that all paths at or deeper than the depth of the last symbolic element in the path field of the Request-URI also are within the protection space specified by the Basic realm value of the current challenge. A client MAY preemptively send the corresponding Authorization header with requests for resources in that space without receipt of another challenge from the server.

在此问题的情况下，如果 GET/ HTTP 请求获得基本身份验证响应 (401 Unauthorized, WWW-Authenticate: Basic Realm="..."响应头)，并且认证成功，所有后续的HTTP请求都会自动带有Authorization头。这是为了改善用户体验——否则，当发送新的 HTTP 请求时，将始终弹出身份验证对话框。想象一下，如果 4 个页面 /、/my-account、/my-orders、/my-address 分别是访问过之后，会弹出4次认证对话框，并强制用户一次又一次地输入凭据，这是非常痛苦的。

如果我不控制给定的 JS 文件，如何删除它们？

要阻止浏览器向某些页面发送Authorization header ，有两种方法:

1. 配置 Nginx 并仅在某些 URL 上启用基本身份验证，例如 /secure/...。这样，对非安全 URL 的 HTTP 请求将不会具有 Authorization header 。
2. 使用摘要式身份验证并在 WWW-Authenticate header 中配置 domain 属性。