0

I am working on REST API using Django and Django Rest Framework. In the front-end I have AngularJs app. I have used Token authentication for APIs. This disables the CSRF checks.

I want keep CSRF validation with REST API. How to achieve this ?

How should I get CSRF Token value so that it can be set into the header of every POST request, using interceptor of my angular application.

Mangesh
  • 981
  • 1
  • 7
  • 14
  • Why do you want to use CSRF validation, what problem are you trying to solve? There's a reason CSRF validation is disabled when using token authentication... – knbk Jan 20 '17 at 12:48
  • Yes, I think we don't need it in case of REST API with Token authentication. – Mangesh Jan 23 '17 at 06:25
  • @knbk could you please mention few or single reason? i am really looking for it.. is it due to that we are already validating user's token which could only be send from a trusted source? – Lal Jan 21 '18 at 08:50
  • 1
    @LalZada It's because sending the token requires an explicit action from something that knows the token. A cross-site request doesn't know the token, so it can't forge a malicious request. In the case of sessions, the session id is _always_ sent with the request, even on a cross-site request from a malicious source, so then it _is_ possible to forge a malicious request if there's not CSRF protection. – knbk Jan 21 '18 at 11:29

2 Answers2

0

I have this configuration in my app.js. Should do the trick!

app.config(function($httpProvider) {
   $httpProvider.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
   $httpProvider.defaults.xsrfCookieName = 'csrftoken';
   $httpProvider.defaults.xsrfHeaderName = 'X-CSRFToken';
});
zubhav
  • 1,519
  • 1
  • 13
  • 19
  • This code to work, we need to have csrf cookie set into the browser. My angular app is not served by django so how initially get this token from server ? – Mangesh Jan 20 '17 at 12:37
0

I've got the same problem when i started to use Angular 1.x with Django and DRF, and then i found this code snippet in a book i think, and it works fine for me. Include this file in your base.html file or your main html file before any javascript import, and everything will work smoothly and you can start talking to your backend.

// Place at /static/js/csrf.js
// CSRF helper functions taken directly from Django docs
function getCookie(name) {
    var cookieValue = null;
    if (document.cookie && document.cookie != '') {
        var cookies = document.cookie.split(';');
        for (var i = 0; i < cookies.length; i++) {
            var cookie = jQuery.trim(cookies[i]);

            // Does this cookie string begin with the name we want?
            if (cookie.substring(0, name.length + 1) == (name + '=')) {
                cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
                break;
            }
        }
    }
    return cookieValue;
}
var csrftoken = getCookie('csrftoken');
function csrfSafeMethod(method) {
// these HTTP methods do not require CSRF protection
    return (/ ˆ (GET|HEAD|OPTIONS|TRACE) $ /.test(method));
}
$.ajaxSetup({
    beforeSend: function (xhr, settings) {
        if (!csrfSafeMethod(settings.type) && !this.crossDomain) {
            xhr.setRequestHeader("X-CSRFToken", csrftoken);
        }
    }
});
Hammadi Ilyes
  • 469
  • 4
  • 6
  • This code to work, we need to have csrf cookie set into the browser. My angular app is not served by django so how initially get this token from server ? – Mangesh Jan 20 '17 at 12:31