CORS Problem using Django backend with Angular app

I'm using Django REST as a backend for my Angular app. When I make a call to API, I get CORS error.

I set up all the CORS configuration in backend side. In settings.py file like:

CORS_ORIGIN_ALLOW_ALL = False
CORS_ALLOW_CREDENTIALS = True
CORS_ALLOW_METHODS = list(default_methods)
CORS_ALLOW_HEADERS = list(default_headers) + [
   'Access-Control-Allow-Origin',
   'app-version'
]

My CORS origin whitelist url is my angular app url and port = https://localhost.com:8002

Also I added corsheaders to INSTALLED APPS and middleware too.

Here is my angular request:

const url = 'https://local-django-api.com:8004/get-data';

    return this.http.get<GetResponseInterface<any>>(`${url}`, {
      headers: {
        'Access-Control-Allow-Credentials': 'true',
        'Access-Control-Allow-Origin': '*',
        'Content-Type': 'application/json',
      },
    });

Note: When I try to make an API call using Postman to the same url, it successfully returns a value.

Does anyone have an idea about this problem. Thanks in advance for any help.

Back to Top