Enabling CORS (Cross Origin Request) in Django

Question

I'm trying to make use of the overpass API http://wiki.openstreetmap.org/wiki/Overpass_API with a JavaScript XMLHttpRequest in a project running on Django but I keep getting the

 Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://www.google.com/accounts/ClientLogin. (Reason: CORS header 'Access-Control-Allow-Origin' missing). 

error. I get this error whether I'm using GET or POST, and from any other host, not just the overpass API.

I've installed django-cors-headers https://github.com/ottoyiu/django-cors-headers and followed the instructions there, putting 'corsheaders' into INSTALLED_APPS, and 'corsheaders.middleware.CorsMiddleware', 'django.middleware.common.CommonMiddleware', into MIDDLEWARE_APPS and I've set

CORS_ORIGIN_ALLOW_ALL = true 

in settings.py but nothing seems to work. I'm running it locally with

python manage.py runserver

but I'm also hosting it on openshift. Neither on of these work, they both give the error above.

Please let me know if I am missing anything here.

Animosity

Are you getting this error in javascript that is trying to access openstreetmap/overpass? – Sinuous

Yes, I'm trying to use XmlHttpRequest in javascript. – Animosity

That's obvious, doesn't answer the question. I'm asking if the site you are trying to enable CORS on is the site that is receiving requests from a different origin, or making requests to a different origin ... i.e. what is the URL that is getting the CORS error – Sinuous

Possible duplicate of https://mcmap.net/q/117301/-how-can-i-enable-cors-on-django-rest-framework/10140011 – Orinasal

Does this answer your question? How can I enable CORS on Django REST Framework – Orinasal

Answer 1

I was having the same problem while trying to access my Django Rest Framework API hosted at Heroku from my laptop (localhost). I am using Django 1.10.2, DRF 3.4.7 and python v3.4.

I did pip install django-cors-headers (version 1.2.2) and configured it as the docs say and then, the same error again :(

Keep searching for hours and then it hit me!

I did pip install django-cors-middleware (version 1.3.1) without uninstalling the django-cors-headers package. Also I didn't touch a thing in my settings.py file (it was configured as the django-cors-headers settings, although these two packages do not have many differences - the latter is a fork of the first).

Hit refresh (from localhost) and everything worked brilliantly!

I was now able to fetch data from myapp.herokuapp.com via jQuery's ajax method.

Guidotti

Why would this work? django-cors-header and django-cors-middleware do not depend on each other, so why would both be required? It did work for me... but I'm confused why. – Largo

Actually, django-cors-middleware is a fork of django-cors-headers (they mention it in their docs). So, that's how it works! – Guidotti

It doesn't work now, and the django-cors-middleware package has been merged into django-cors-header and is not maintained anymore. – Eiland

Answer 2

Remember to put the 'corsheaders.middleware.CorsMiddleware' in the top of your list, and also the 'django.middleware.common.CommonMiddleware' is already a standard middleware

MIDDLEWARE = [
'corsheaders.middleware.CorsMiddleware',
'django.middleware.security.SecurityMiddleware',
'django.contrib.sessions.middleware.SessionMiddleware',
'django.middleware.common.CommonMiddleware',
'django.middleware.csrf.CsrfViewMiddleware',
'django.contrib.auth.middleware.AuthenticationMiddleware',
'django.contrib.messages.middleware.MessageMiddleware',
'django.middleware.clickjacking.XFrameOptionsMiddleware',
 ]

Saleable

Answer 3

CORS_ORIGIN_ALLOW_ALL = true

should be:

CORS_ORIGIN_ALLOW_ALL = True

T capital letter for True. Add additional required middleware

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

and register 'corsheaders', to INSTALLED_APPS.

Chlorous

where to add CORS_ORGIN_ALLOW_ALL = TRUE. – Peta

@SULPHURICACID in your settings file – Shotten