[Python] django-cors-headers does not allow a request from an allowed origin

The problem that I am facing is that I cannot fetch an existing user from my NextJS frontend. The backend framework that I use is Django (along with the django-cors-headers package). django-cors-headers does not allow a certain HTTP request, while it should.

My next.config.js contains a rewrite, so that I can access my backend.

async redirects() {
return [
{
source: '/api/ath*',
destination: 'http://localhost:8000/ath*/',
permanent: true,
},
]
},


And my django-cors-headers settings look like this:

# CORS

CSRF_TRUSTED_ORIGINS = [
'http://localhost:3000',
]

CORS_ALLOWED_ORIGINS = [
'http://localhost:3000',
'http://localhost:8000',
'http://127.0.0.1:3000',
'http://127.0.0.1:8000',
]

CORS_ALLOW_ALL_ORIGINS = True


The request that fails attempts to fetch a user with an ID of 1. This user exists and therefore, this request should succeed.

fetch(`/api/users/${String(userId)}/`, {
mode: 'cors',
credentials: 'include',
headers: {
'Content-Type': 'application/json',
},
})


However, the only thing that I get back from the request is an error message about CORS.

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://localhost:8000/users/1.
(Reason: CORS header ‘Access-Control-Allow-Origin’ missing).
Status code: 301.


It looks like my django-cors-headers setup is wrong. But I am allowed to obtain my JWT tokens. The following request succeeds.

fetch('/api/token', {
method: 'POST',
mode: 'cors',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({
email: mail,
password,
}),
})

Continue reading...