9

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.

Abendsen
  • 173
  • 2
  • 2
  • 5
  • Are you getting this error in javascript that is trying to access openstreetmap/overpass? – Jaromanda X Jul 20 '16 at 13:18
  • Yes, I'm trying to use XmlHttpRequest in javascript. – Abendsen Jul 20 '16 at 20:03
  • 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 – Jaromanda X Jul 21 '16 at 01:01
  • Possible duplicate of https://stackoverflow.com/q/35760943/10140011 – Hemant Feb 10 '21 at 18:17
  • 1
    Does this answer your question? [How can I enable CORS on Django REST Framework](https://stackoverflow.com/questions/35760943/how-can-i-enable-cors-on-django-rest-framework) – Hemant Feb 10 '21 at 18:18

3 Answers3

9

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.

nik_m
  • 11,825
  • 4
  • 43
  • 57
  • 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. – inostia Nov 15 '19 at 22:46
  • 1
    Actually, [`django-cors-middleware`](https://github.com/zestedesavoir/django-cors-middleware) is a fork of [`django-cors-headers`](https://github.com/adamchainz/django-cors-headers) (they mention it in their docs). So, that's how it works! – nik_m Nov 16 '19 at 15:21
  • It doesn't work now, and the `django-cors-middleware` package has been merged into `django-cors-header` and is not maintained anymore. – Grum Sep 01 '23 at 17:58
5

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',
 ]
Pedro Fam
  • 51
  • 1
  • 3
5

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.

JSalys
  • 159
  • 2
  • 3