1

I want to post data to django app, I use angularjs http to post. When I post data, I get a 403 forbidden. So, I changed MY angular script to this:

var app = angular.module('omCenterLoginApp',['ngCookies']);
 app.config(['$httpProvider', function ($httpProvider,$cookies) {
      $httpProvider.defaults.xsrfHeaderName = 'X-CSRFToken';
      $httpProvider.defaults.xsrfCookieName = 'csrftoken';
}])

app.controller('omCenterLoginContr',function($scope,$http){
    $scope.login = function(){
        var user = $scope.username;
        var password = $scope.password;
        $http({
            method: 'POST',
            url:'http://172.100.1.8:8080/api/test/',
            data:{user:password},
        }).then(function successCallback(response){
               console.log(response.data)
               },function errorCallback(response){
                console.log(response.data) 
            })
    }
});

I added,

$httpProvider.defaults.xsrfHeaderName = 'X-CSRFToken'; $httpProvider.defaults.xsrfCookieName = 'csrftoken';

but, when I tried to post it, still got response a 403 error. I checked the post http header. There is no X-CSRFToken in it. 

Accept:application/json, text/plain, */*
Accept-Encoding:gzip, deflate
Accept-Language:zh-CN,zh;q=0.8,en;q=0.6
Cache-Control:no-cache
Connection:keep-alive
Content-Length:2
Content-Type:application/json;charset=UTF-8
Host:172.100.1.8:8080
Origin:http://172.100.1.8
Pragma:no-cache
Referer:http://172.100.1.8/login.html?
User-Agent:Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/59.0.3071.115 Safari/537.36

My angularjs version:1.5.8

But when I tried to visit the url http://172.100.1.8:8080/api/test/,I can get the response .

The http request is :

Accept:text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8
Accept-Encoding:gzip, deflate
Accept-Language:zh-CN,zh;q=0.8,en;q=0.6
Cache-Control:no-cache
Connection:keep-alive
Cookie:sessionid=jbg90n8118w6qhcmbom8txctui2s59ca; csrftoken=tBsTGiBtcgMOw8MFslu6v3UJEdSXkmYF
Host:172.100.0.48:8080
Pragma:no-cache
Upgrade-Insecure-Requests:1
User-Agent:Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/59.0.3071.115 Safari/537.36

The csrftoken is exist.

Thank you for your help in advance.

qin peter
  • 339
  • 3
  • 15
  • can you check: is the cookies exist? – Brown Bear Aug 03 '17 at 07:33
  • I'm having the exact same issue and the cookie does exist but isn't being sent. Same version of AngularJs and everything. Any updates on possible solutions here? – btm1 Jan 19 '18 at 20:48

1 Answers1

0

This is a fairly complicated way to use CSRF via Single Page applications unless you are serving the pages via Django. Try using some other form of authentication like Token Auth or JWT Auth when using Single Page App to hit Django APIs. This can be easily achieved by the excellent Django Rest Framework. Even if you dont prefer to use it then you can simply use some authentication library like django-oauth. Just for testing however you can use the csrf_exempt decorator to allow your angular app to send requests without csrf token(You are opening vulnerabilities on your code with this though). Its always a good practice to use some kind of authentication.

rmad17
  • 164
  • 7