Skip to content

how to pass csrf_token to javascript file in django?

Here is my javascript code that works fine. but I like to keep javascript files seperate and not use as inline script tags

    $('.book').click(function() {
         var id= $(this).attr('id');
              'csrfmiddlewaretoken':'{{ csrf_token }}',
            url: '/post/book/',
            success: function(data){
               //do something
              else {
                  //do something
            error: function(error){
              alert('error; '+ eval(error));
          return false;

I want to include this in my custom.js file that I have included in my base.html. which is

{% load static from staticfiles %}
{% load bootstrap3 %}
<!DOCTYPE html>
<html lang="en">
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">

  <title>{% block title %}{% endblock %}</title>
  {% bootstrap_css %}
  <!-- Optional theme -->
  <link rel="stylesheet" href="//">
  <link href="{% static "css/custom.css" %}" rel="stylesheet">
  <!-- Latest compiled and minified JavaScript -->
  <script src="//"></script>
  <script src=""></script>
  <script src="{% static "js/custom.js" %}" ></script>
  <script src="{% static "js/jquery.blockUI.js" %}"></script>
  {% bootstrap_javascript %}
  {% load bootstrap3 %}
{% load static from staticfiles %}
{% block content %} {% endblock %}

I am not able to reference csrf_token that is available in the current template in Django to the static js file. how can I get this to work?



If you want to reference template tags then you need that file to be templated (rendered) by Django. And I wouldn’t recommend rendering all your static files via django…

You can either put the csrf_token in a global variable that you then access from your script. Something like this in your base.html:

    var csrftoken = '{{ csrf_token }}';

Or you can pull the csrftoken from the cookies in your javascript file. See this question for a solution for that. The cookie is called csrftoken. You can view it by opening up your dev tools and looking at the cookies for your domain.