将 react-django 暂存站点置于基本身份验证之后,但身份验证与端点的令牌身份验证发生冲突

Putting a react-django staging site behind basic auth, but auth clashes with token auth for endpoints

什么情况?

我有一个用 Django + React 构建的暂存站点。

部分 API 您必须登录才能访问。为此,我正在使用 Django 的令牌身份验证。

然后我想将整个网站置于基本身份验证之后,以防止任何人不小心绊倒它。

有什么问题吗?

这意味着我的请求需要通过两种身份验证方法。这是可能的,如 here.

所述

Authorization: Token lksdjf893kj2nlk2n3rl2dOPOnm, Basic YXNkZnNhZGZzYWRmOlZLdDVOMVhk

令牌是在用户登录时提供给用户后在我的 JS 代码中设置的。

基本身份验证在第一个页面加载时触发,此后浏览器存储它,我相信它会自动附加到服务器具有以下内容的任何请求中 header:

WWW-Authenticate: basic

我已将 Django 配置为 return 以下 header:

WWW-Authenticate: basic, token

当授权 header 为空时,这成功地导致通过 axios 发送的 XHR 请求附加了基本 header。

问题是 Authorization header 不为空,因为我需要在其中设置一个标记值。

 const axiosConfig = {
    method: requestType,
    url: `${url}`,
    withCredentials: true,
    headers: {
        Accept: "application/json",
        "Content-Type": "application/json"
    },
    data: payload
};

// If we're logged in then send our auth token
if (localStorage.auth_token) {
    // Axios can't see the basic authentication header here so we can't append.
    console.log(axiosConfig.headers.Authorization);

    // Basic auth will only get sent if I don't set anything here
    axiosConfig.headers.Authorization = `Token ${localStorage.auth_token}`;
}

此时浏览器似乎不再附加基本 header,因此我的身份验证失败。

有办法解决这个问题吗?

我想要一个全面的基本身份验证,因为我不可能在暂存时不小心暴露任何东西,否则我必须完全依赖令牌身份验证和 robots.txt 这不太理想。

最后的答案是端口转发。

我删除了基本身份验证,关闭了端口 80 和 443,然后使用端口转发将我的 SSH 映射到本地主机。

ssh -N -L 8755:127.0.0.1:443 user@ip_address