I have researched and read quite a few Stackoverflow posts on the same issue. None have resolved my issue.
My problem is that I am getting the "...No 'Access-Control-Allow-Origin' header is present on the requested resource..." error in my console.
I am using:
Chrome Version 57.0.2987.133
Firefox Version 52.0.2
Python 2.7
Django 1.11a1
AngularJS
I am using MAMP to serve my front-end Angular stuff, and the django server for the backend stuff.
In my django settings I have included the cors middleware and tried both the whitelist approach and just setting all to true:
MIDDLEWARE = [
'django.middleware.security.SecurityMiddleware',
'django.contrib.sessions.middleware.SessionMiddleware',
'corsheaders.middleware.CorsMiddleware',
'django.middleware.common.CommonMiddleware',
'django.middleware.csrf.CsrfViewMiddleware',
'django.contrib.auth.middleware.AuthenticationMiddleware',
'django.contrib.messages.middleware.MessageMiddleware',
'django.middleware.clickjacking.XFrameOptionsMiddleware',
]
CORS_ORIGIN_ALLOW_ALL = True
On google chrome I still get this error:
localhost/:1 XMLHttpRequest cannot load {my endpoint url}. Redirect
from {my endpoint url} to {my endpoint url with a } has been blocked
by CORS policy: No 'Access-Control-Allow-Origin' header is present on
the requested resource. Origin {requesting url} is therefore not
allowed access.
It works appropriately on Firefox, and I can't figure out why it won't work for google chrome. I haven't tried any other types of browsers. Any help will be very appreciated, thank you.
Install the cors-headers package with
pip install django-cors-headers
Adds to your installed apps
INSTALLED_APPS = [
...
'corsheaders',
...
]
Add on your MIDDLEWARE
remember to add as being the first in the list
MIDDLEWARE = [
'corsheaders.middleware.CorsMiddleware',
'django.middleware.common.CommonMiddleware',
...
]
Before installed apps put this configuration for anyone to access
CORS_ORIGIN_ALLOW_ALL=True
Or create a list of hits
CORS_ORIGIN_WHITELIST = [
'google.com',
'hostname.example.com',
'localhost:8000',
'127.0.0.1:9000'
]
Check your request url first.I had this problem when use vue-resource .And then find i missing '/' at the end or url.
Make sure use 127.0.0.1
NOT localhost
because when using localhost
browser may look up an IPv6 address...
or set up localhost
to explicitly to 127.0.0.1
at /etc/hosts
Perhaps you need to take a look at how you are calling your middlewares. If they are not in the correct sequence they might throw this error. It seems like your 'django.middleware.security.SecurityMiddleware'
needs to be pushed below the 'corsheaders.middleware.CorsMiddleware'
.
Also, it looks like you might have to add
CORS_ALLOW_CREDENTIALS = True
in your code as well.
Hope this helps.
the reason that is chrome browse; you can install CORS Toggle app in chrome or deploy your web code to nginx or apache then using chrome.
Old question, but I'm not seeing this solution, which worked for me, anywhere. So hoping this can be helpful for someone.
Cross-origin requests in this context are only possible if the partner site's server allows it through their response headers.
I got this to work in Django without any CORS middleware by setting the following headers on the response:
response["Access-Control-Allow-Origin"] = "requesting_site.com"
response["Access-Control-Allow-Methods"] = "GET"
response["Access-Control-Allow-Headers"] = "requesting_site.com"
Most answers on StackOverflow seem to mention the first one, but not the second two. I've just confirmed they are all required. You'll want to modify as needed for your framework or request method (GET, POST, OPTION).
p.s. You can try "*"
instead of "requesting_site.com"
for initial development just to get it working, but it would be a security hole to allow every site access. Once working, you can restrict it for your requesting site only to make sure you don't have any formatting typos.
You can install django-cors-headers app and in the settings.py you should put 'corsheaders'
in the INSTALLED_APPS and
'corsheaders.middleware.CorsMiddleware',
'django.middleware.common.CommonMiddleware',
in the starting of the MIDDLEWARE of the settings
The README of the Github link explains the details