angularjs doesnt POST to my django based apis - giving CORS error

Question

This has been plaguing me for quite a while now. I've set up a basic set of apis in Django and am building an angularJS based front end. However for some weird reason the following code results in a CORS error.

    var req = {
  method: 'POST',
  url: url,
  headers: {'Content-Type': 'application/x-www-form-urlencoded'},
  withCredentials: true,
  param: data,
  data: data
}

return $http(req).then(
        function(response){
          callbackSuccess(response);
        },
        function(response){
          callbackError(response);
        }
      );

I found out two things that when I do a post an OPTIONS request is made and secondly none of what I post is even posted. I try to out put the request.POST contents and its empty.

Internal Server Error: /api/users/auth/
Traceback (most recent call last):
  File "/home/ali/eb-virt/local/lib/python2.7/site-packages/django/core/handlers/base.py", line 149, in get_response
    response = self.process_exception_by_middleware(e, request)
  File "/home/ali/eb-virt/local/lib/python2.7/site-packages/django/core/handlers/base.py", line 147, in get_response
    response = wrapped_callback(request, *callback_args, **callback_kwargs)
  File "/home/ali/eb-virt/local/lib/python2.7/site-packages/django/views/decorators/csrf.py", line 58, in wrapped_view
    return view_func(*args, **kwargs)
  File "/home/ali/eb-virt/local/lib/python2.7/site-packages/django/utils/decorators.py", line 149, in _wrapped_view
    response = view_func(request, *args, **kwargs)
  File "/home/ali/Projects/api.project.local/project/api/views.py", line 50, in loginUser
    emailAddress = request.POST["emailAddress"]
  File "/home/ali/eb-virt/local/lib/python2.7/site-packages/django/utils/datastructures.py", line 85, in __getitem__
    raise MultiValueDictKeyError(repr(key))
MultiValueDictKeyError: "'emailAddress'"
[21/Nov/2016 07:56:59] "OPTIONS /api/users/auth/ HTTP/1.1" 500 81083

And this is my server code:

def loginUser(request):
  emailAddress = ''
  password = ''
  emailAddress = request.POST["emailAddress"]
  password = request.POST["password"]



  data = auth.login(emailAddress, password)

  return data

I've installed the django-cors-headers and followed all the instructions to the core but its still not working...

post your server code. you are accepting OPTION method inside view.' — itzMEonTV
– itzMEonTV, Commented Nov 21, 2016 at 8:29
I added the server code - I'm checking for POST - how do I accept OPTION method? doing a pp.pprint of the request.POST outputs an empty dict object — Ali
– Ali, Commented Nov 21, 2016 at 8:56
You need to tell your server what requests to accept (POST, GET ...) and also from whom it can accept. Those are 2 headers that you need to set. Did you set them ? — user4676340
– user4676340, Commented Nov 21, 2016 at 9:01
How do I do that - I've made the setting CORS_ALLOW_METHODS in settings to include POST and GET but it seems to be ignored here.. — Ali
– Ali, Commented Nov 21, 2016 at 9:04

Prakhar Trivedi · Accepted Answer · 2016-11-21 09:03:38Z

2

The problem is in Line :

emailAddress = request.POST["emailAddress"]

In the place of this line,use this code:

def loginUser(request):

  if request.method == 'POST':
    emailAddress = request.POST.get('emailAddress')  
    password = request.POST.get('password') 

    data = auth.login(emailAddress, password)

    return data

request.POST["emailAddress"] will raise a KeyError exception if 'emailAddress' is not in request.POST.

While request.POST.get('emailAddress') will return None if 'emailAddress' is not in request.POST.

edited Nov 21, 2016 at 9:03

answered Nov 21, 2016 at 8:58

Prakhar Trivedi

8,5563 gold badges30 silver badges36 bronze badges

Sign up to request clarification or add additional context in comments.

9 Comments

Prakhar Trivedi Over a year ago

@Ali Updated my answer.Please check now.

Prakhar Trivedi Over a year ago

@Ali You need to make sure that the emailAddress and password fields are getting passed with post request.

Prakhar Trivedi Over a year ago

@Ali Did you use csrf token??

Prakhar Trivedi Over a year ago

@Ali This is a new problem.I corrected your earlier code and this is not mentioned anywhere in the original question.

Prakhar Trivedi Over a year ago

@Ali try this answer stackoverflow.com/questions/20671619/…

|

itzMEonTV · Accepted Answer · 2016-11-21 10:05:41Z

1

OPTION request is doing by your browser for a safety whether it can send POST request(in case of cross domain). It should return a 200 with some headers(will take care of cors-headers middleware if you added it). So In server, accept POST request this way(assume function based views).

if request.method == 'POST':
    #access POST variables here.

edited Nov 21, 2016 at 10:05

answered Nov 21, 2016 at 8:31

itzMEonTV

20.4k4 gold badges44 silver badges53 bronze badges

2 Comments

itzMEonTV Over a year ago

@Ali , OPTION request is doing by your browser for a safety whether it can send POST request(in case of cross domain).

Ali Over a year ago

Yeh figured that out found the issue :) thanks for the help

Ali · Accepted Answer · 2016-11-21 09:36:01Z

0

Found the issue - was a total noob mistake.

My version of Django in my virtual environment was 1.9 whereas I had generated the project from a version 1.10 so in the settings the MIDDLEWARE option had to be named as MIDDLEWARE_CLASSES - silly mistake had me stuck for two days - thanks everyone for all your answers :)

answered Nov 21, 2016 at 9:36

Ali

7,49322 gold badges106 silver badges167 bronze badges

Collectives™ on Stack Overflow

angularjs doesnt POST to my django based apis - giving CORS error

3 Answers 3

9 Comments

2 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

9 Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related