The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute

Question

Before I ask this question, I have read this related post.

In my settings.py:

INSTALLED_APPS = [
    ...
    'corsheaders',
]

CORS_ORIGIN_ALLOW_ALL = False
CORS_ALLOW_CREDENTIALS = True
CORS_ORIGIN_WHITELIST = (
        'http://103.200.30.76'
        )

My website frontend is use Apache listen 80 port, and I use

python3 manage.py runserver 103.200.30.76:8001

But I still get the bellow error:

Failed to load http://103.200.30.76:8001/api/website/websitemanage/footerreconmend/list/: Response to preflight request doesn't pass access control check: The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'. Origin 'http://103.200.30.76' is therefore not allowed access. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.

One of the request is like this:

General:

Request URL:http://103.200.30.76:8001/api/website/websitemanage/homepagefunctionshow/list/
Request Method:OPTIONS
Status Code:200 OK
Remote Address:103.200.30.76:8001
Referrer Policy:no-referrer-when-downgrade

Response Headers

Access-Control-Allow-Credentials:true
Access-Control-Allow-Headers:accept, accept-encoding, authorization, content-type, dnt, origin, user-agent, x-csrftoken, x-requested-with
Access-Control-Allow-Methods:DELETE, GET, OPTIONS, PATCH, POST, PUT
Access-Control-Allow-Origin:http://103.200.30.76
Access-Control-Max-Age:86400
Content-Length:0
Content-Type:text/html; charset=utf-8
Date:Mon, 11 Dec 2017 02:44:12 GMT
Server:WSGIServer/0.2 CPython/3.5.2
Vary:Origin
X-Frame-Options:SAMEORIGIN

Request Headers:

Accept:*/*
Accept-Encoding:gzip, deflate
Accept-Language:zh-CN,zh;q=0.9,en;q=0.8
Access-Control-Request-Headers:access-control-allow-origin,x-requested-with
Access-Control-Request-Method:GET
Connection:keep-alive
Host:103.200.30.76:8001
Origin:http://103.200.30.76
User-Agent:Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/63.0.3239.84 Safari/537.36

So, who can help me with this, please?

EDIT

I find , if I use bellow command (disable-web-security) to open Chrome, I will not have that issue.

open -a "Google Chrome" --args --disable-web-security --user-data-dir

EDIT - 2

I tried Naqib Hakimi's answer, use a middle ware:

class AccessControl(MiddlewareMixin):
    def process_request(self, request):

        if 'HTTP_ACCESS_CONTROL_REQUEST_METHOD' in request.META:
            response = http.HttpResponse()
            response["Access-Control-Allow-Origin"]= "*"
            response["Access-Control-Allow-Credentials"] = "true"
            response["Access-Control-Allow-Methods"]= "GET,HEAD,OPTIONS,POST,PUT"
            response["Access-Control-Allow-Headers"] = "Authentication , Authorization , X-CSRF-Token , Access-Control-Allow-Credentials , Access-Control-Allow-Methods , Access-Control-Allow-Origin , Access-Control-Allow-Headers, Origin,Accept, X-Requested-With, Content-Type, Access-Control-Request-Method, Access-Control-Request-Headers"

            return response

        return None

But still has this issue.

I checked the request in debugger:

There is no HTTP_ACCESS_CONTROL_REQUEST_METHOD in request.META.

score 0 · Answer 1 · answered Dec 11 '17 at 14:23

by default django dose not allow Access-Control-Allow-Origin for all domains you should add a MIDDLEWARE_CLASSES to do this .

class AccessControl(object):
    def process_request(self, request):

        if 'HTTP_ACCESS_CONTROL_REQUEST_METHOD' in request.META:
            response = http.HttpResponse()
            response["Access-Control-Allow-Origin"]= "*"
            response["Access-Control-Allow-Credentials"] = "true"
            response["Access-Control-Allow-Methods"]= "GET,HEAD,OPTIONS,POST,PUT"
            response["Access-Control-Allow-Headers"] = "Authentication , Authorization , X-CSRF-Token , Access-Control-Allow-Credentials , Access-Control-Allow-Methods , Access-Control-Allow-Origin , Access-Control-Allow-Headers, Origin,Accept, X-Requested-With, Content-Type, Access-Control-Request-Method, Access-Control-Request-Headers"

            return response

        return None

then in setting.py

MIDDLEWARE_CLASSES = [
    ...
    'app.filename.AccessControl',

    ]

this will allow requests from all domains

The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute

1 Answers1