Django Vue PWA登录在开发中工作，但在生产中返回401

我有一个

Vue.js PWA

和一个

Django Rest框架

后端，它可以在我的笔记本电脑上本地正常工作（使用浏览器）。当我将其部署到生产环境中时，当我使用浏览器登录时，它仍能正常工作，但当以PWA（即：在手机上或浏览器中保存的PWA）打开时，它无法登录

这是我的登录代码：

axios
.post（“/api/get-token/”，用户）
。然后（res=>{
setItem（'user-token'，res.data.token）；
axios.defaults.headers.common['Authorization']=res.data.token；
提交（AUTH_SUCCESS，res.data）；
决议（res）；
})
.catch（错误=>{
提交（AUTH_ERROR，err）；
拒绝（错误）；
});

如前所述，通过浏览器登录时，一切都在本地和生产环境中工作。当尝试使用PWA登录时会出现问题

尝试登录PWA时，我得到以下信息：

POST https://www.example.com/api/get-token/ 401 (Unauthorized)

正在对从服务器接收到的错误执行控制台日志：

{
  detail: "Invalid token header. No credentials provided."
  __proto__: Object
  status: 401
  statusText: "Unauthorized"
  headers: {allow: "POST, OPTIONS", connection: "keep-alive", content-length: "59", content-type: "application/json", date: "Thu, 06 Feb 2020 15:00:11 GMT", …}
  config:
    url: "/api/get-token/"
    method: "post"
    data: "{"username":"test@example.com","password":"password"}"
    headers:
      Accept: "application/json, text/plain, */*"
      Authorization: "Token "
      Content-Type: "application/json;charset=utf-8"
   __proto__: Object
  transformRequest: [ƒ]
  transformResponse: [ƒ]
  timeout: 0
  adapter: ƒ (t)
  xsrfCookieName: "csrftoken"
  xsrfHeaderName: "X-CSRFToken"
  maxContentLength: -1
  validateStatus: ƒ (t)
}

在生产中，应进行以下工作：

使用笔记本电脑或手机上的浏览器登录网站

然后打开PWA。这工作正常，我可以继续使用PWA

---

唯一的问题出现在尝试使用PWA登录时。

您可以在本地通过电话登录吗？我也曾经遇到过这个问题，问题是前端和后端没有在同一台主机上运行。这解决了我的问题：

devServer: {
    proxy: {
      '/api': {
        target: 'http://localhost:5000'
      }
    }
  }

---

我最终解决了这个问题。出于某种原因，在标题中发布了以下内容：

授权：“令牌”

这真的很奇怪，因为当使用

/api/get-token/

登录时，不需要令牌，因为这是登录路径。此外，它在浏览器中也能完美工作。唯一的问题是从PWA尝试时

---

无论如何，将头更改为显式地没有

授权的值

修复了如下问题：

授权：

本地所有操作都正常。我已经在使用devServer代理配置选项。问题在于生产。vue应用程序和Django后端在生产环境中运行在同一台服务器上，一旦登录，一切正常，…只是登录不起作用。