How to resolve CORS HEADER ERROR in Django ?

Why CORS Header Errors Occur

JavaScript follows the same-origin policy, which means that a page from www.example.com can only make AJAX requests to exactly the same domain (www.example.com).

Requests to example.com (without "www") or sub.example.com will be blocked unless the target server explicitly allows them.

• The Issue If AJAX request is trying to reach http://somesite.com from a page hosted on http://www.somesite.com. While they seem similar, they are considered different domains.

For cross-origin requests to work, the target server (http://somesite.com) must include the Access-Control-Allow-Origin header in its response. Since this header is missing, the browser blocks the request, resulting in a CORS error.

NOTE

http://somesite.com and http://www.somesite.com are considered different domains because web browsers treat subdomains as separate origins.

Here’s why:

"www" is a subdomain

somesite.com → Root domain

www.somesite.com → Subdomain of somesite.com

Same-Origin Policy (SOP) Restriction

The protocol (http/https), domain, and port must match exactly for the browser to consider them the same origin.

Since www.somesite.com is technically different from somesite.com, browser blocks cross-origin AJAX requests unless the server explicitly allows them via CORS headers.

To fix this issue, use below options -

Solution 1: Fix the URL

Your issue might simply be a typo. If http://somesite.com and http://www.somesite.com are actually the same server, make sure your AJAX request uses the same format as your page’s URL.

• Instead of http://somesite.com, use http://www.somesite.com.
• Or, use a relative URL (/login.php) instead of an absolute one.

Solution 2: Check for Missing or Incorrect URL Formatting

Sometimes, CORS errors happen because of minor URL mistakes, such as:

• Missing a forward slash (/) at the end.
• Using http instead of https (or vice versa).

Double-check your URLs to ensure they match exactly.

Solution 3: Configure the Server to Allow Cross-Origin Requests

If your target server is intentionally different from the origin (e.g., an API on another domain), you'll need to modify its settings:

• Add the following header to the server’s response:

Access-Control-Allow-Origin: *

(Or replace * with a specific domain, like http://www.somesite.com.)

To Fix CORS Errors in Django - be aware that Django does not allow cross-origin requests by default.

To enable CORS, follow these steps:

• Install django-cors-headers

Run the following command to install the package:

pip install django-cors-headers

• Add It to INSTALLED_APPS in settings.py

In your Django settings file (settings.py), add 'corsheaders' to INSTALLED_APPS:

INSTALLED_APPS = [
    ...
    'corsheaders',
    ...
]

• Add Middleware

Now, add 'corsheaders.middleware.CorsMiddleware' above 'django.middleware.common.CommonMiddleware':

MIDDLEWARE = [
    'corsheaders.middleware.CorsMiddleware',
    'django.middleware.common.CommonMiddleware',
    ...
]

• Configure CORS Settings

Allow All Domains (Not Recommended for Production)

Warning: This is not secure and should only be used for testing.

If you want to allow requests from any origin, set:

CORS_ALLOW_ALL_ORIGINS = True  # Previously CORS_ORIGIN_ALLOW_ALL

• Allow Specific Domains (Recommended)

If you want to allow only certain domains, use below.

This ensures that only somesite.com and www.somesite.com can make cross-origin requests.

CORS_ALLOWED_ORIGINS = [
    "http://www.somesite.com",
    "http://somesite.com",
]

• Allow Specific HTTP Methods (Optional)

By default, Django allows only GET requests. If you need POST, PUT, or DELETE, specify them:

CORS_ALLOW_METHODS = [
    "GET",
    "POST",
    "PUT",
    "PATCH",
    "DELETE",
    "OPTIONS",
]

• Allow Specific Headers (Optional)

If your request includes custom headers, you must allow them:

CORS_ALLOW_HEADERS = [
    "content-type",
    "authorization",
    "x-requested-with",
]

• Restart Your Django Server

Once the changes are made, restart the server:

python manage.py runserver

• Final Thoughts

If you're still facing CORS issues, check if your frontend is making requests to the correct domain (e.g., www.somesite.com vs. somesite.com).

Ensure that the Django server isn't blocking requests due to CSRF protection (use csrf_exempt for testing, but handle CSRF properly in production).

If using Django with a reverse proxy (e.g., Nginx or Apache), make sure the proxy isn’t stripping CORS headers.