POST-запрос возвращает 401 Unauthorised (только в Chrome)
Я использую Django Rest Framework и Vue.js для создания базового веб-приложения и сейчас работаю над аутентификацией. При использовании axios для отправки post запроса при регистрации нового пользователя почему-то возвращается 401 в Chrome, но в других браузерах (Edge) работает и возвращает 201 Created.
Ошибка в хроме - "detail: Invalid Token", но эта конкретная конечная точка (регистрация) даже не требует auth/token для доступа.
Мой фронтенд находится по адресу http://192.168.1.33:8080, а мой бэкенд находится по адресу http://127.0.0.1:8000. Я пытаюсь отправить данные на адрес http://127.0.0.1:8000/api/v1/users/auths/
Вкладка "Сеть" в chrome dev tools после попытки запроса:
Request URL: http://127.0.0.1:8000/api/v1/users/auths/
Request Method: POST
Status Code: 401 Unauthorized
Remote Address: 127.0.0.1:8000
Referrer Policy: strict-origin-when-cross-origin
Access-Control-Allow-Origin: http://192.168.1.33:8080
Allow: GET, POST, HEAD, OPTIONS
Content-Length: 27
Content-Type: application/json
Date: Mon, 06 Dec 2021 12:19:15 GMT
Referrer-Policy: same-origin
Server: WSGIServer/0.2 CPython/3.8.5
Vary: Accept, Origin
WWW-Authenticate: Token
X-Content-Type-Options: nosniff
X-Frame-Options: DENY
Accept: application/json, text/plain, */*
Accept-Encoding: gzip, deflate, br
Accept-Language: en-US,en;q=0.9
Authorization: Token acf8b9099de5eba413dea141ce2c06b6cfb03159
Connection: keep-alive
Content-Length: 53
Content-Type: application/json
Host: 127.0.0.1:8000
Origin: http://192.168.1.33:8080
Referer: http://192.168.1.33:8080/
sec-ch-ua: " Not A;Brand";v="99", "Chromium";v="96", "Google Chrome";v="96"
sec-ch-ua-mobile: ?0
sec-ch-ua-platform: "Windows"
Sec-Fetch-Dest: empty
Sec-Fetch-Mode: cors
Sec-Fetch-Site: cross-site
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/96.0.4664.45 Safari/537.36
Вкладка "Сеть" в Edge dev tools после попытки сделать то же самое:
Request URL: http://127.0.0.1:8000/api/v1/users/auths/
Request Method: POST
Status Code: 201 Created
Remote Address: 127.0.0.1:8000
Referrer Policy: strict-origin-when-cross-origin
Access-Control-Allow-Origin: http://192.168.1.33:8080
Allow: GET, POST, HEAD, OPTIONS
Content-Length: 89
Content-Type: application/json
Date: Mon, 06 Dec 2021 12:20:25 GMT
Location: http://127.0.0.1:8000/api/v1/users/auths/12/
Referrer-Policy: same-origin
Server: WSGIServer/0.2 CPython/3.8.5
Vary: Accept, Origin, Cookie
X-Content-Type-Options: nosniff
X-Frame-Options: DENY
Accept: application/json, text/plain, */*
Accept-Encoding: gzip, deflate, br
Accept-Language: en-US,en;q=0.9
Authorization
Connection: keep-alive
Content-Length: 51
Content-Type: application/json
Host: 127.0.0.1:8000
Origin: http://192.168.1.33:8080
Referer: http://192.168.1.33:8080/
sec-ch-ua: " Not A;Brand";v="99", "Chromium";v="96", "Microsoft Edge";v="96"
sec-ch-ua-mobile: ?0
sec-ch-ua-platform: "Windows"
Sec-Fetch-Dest: empty
Sec-Fetch-Mode: cors
Sec-Fetch-Site: cross-site
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/96.0.4664.55 Safari/537.36 Edg/96.0.1054.43
Очевидное различие заключается в том, что во вкладке "Сеть" Chrome присутствует "WWW-Authenticate: Token" во вкладке Chrome Network, что странно.
Заголовки CORS и все остальное было настроено правильно, плюс проблема возникает только в Chrome. Это какая-то причуда Chrome, или я что-то упускаю?
Почему, потратив около двух часов на решение задачи, вы получаете ответ только после того, как разместите его на форуме? Возможно, это связано с категоричным и формальным изложением проблемы...
В любом случае. Оказалось, что проблема была в том, что в локальном хранилище Chrome находился случайный токен, который и вызывал все проблемы с "недействительным" токеном. Я очистил локальное хранилище, и теперь все работает. Не знаю, почему мне пришлось делать это специально - я убедился, что очистил кэш ранее...