将 react-django 暂存站点放在基本身份验证后面，但身份验证与端点的令牌身份验证冲突答案

【问题标题】：Putting a react-django staging site behind basic auth, but auth clashes with token auth for endpoints将 react-django 暂存站点放在基本身份验证后面，但身份验证与端点的令牌身份验证冲突
【发布时间】：2019-12-17 20:38:19
【问题描述】：

情况如何？

我有一个使用 Django + React 构建的临时站点。

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

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

有什么问题？

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

Authorization: Token lksdjf893kj2nlk2n3rl2dOPOnm, Basic YXNkZnNhZGZzYWRmOlZLdDVOMVhk

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

基本身份验证在第一个页面加载时触发，之后浏览器存储它，我相信会自动将其附加到服务器具有以下标头的任何请求中：

WWW-Authenticate: basic

我已将 Django 配置为返回以下标头：

WWW-Authenticate: basic, token

当 Authorization 标头为空时，这会成功导致通过 axios 发送的 XHR 请求附加基本标头。

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

 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}`;
}

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

有没有办法解决这个问题？

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

【问题讨论】：

标签： authentication axios basic-authentication staging

【解决方案1】：

最后的答案是端口转发。

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

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

【讨论】：