2011-12-23 22 views
18

Tengo 2 páginas html.Jquery y Django CSRF Token

Una página principal y una página secundaria. La página secundaria contiene un botón Enviar que ejecuta el código en la página principal para enviar un mensaje Ajax.

Cardo la página secundaria usando el método $ .load() y luego, cuando se hace clic en el botón, se ejecuta el método $ .ajax. POST. Este método de publicación solo pasa una Cadena JSON al Código Python.

Cuando hago esto en cualquier navegador excepto IE Funciona bien. Sin embargo, cuando ejecuto este código en IE. Obtengo los errores de Python/Django sobre los tokens CSRF.

I Think La razón es porque la página secundaria es solo una actualización de la página actual con el código del servidor que se está ejecutando.

¿Alguien sabe cómo debo hacer para que esto funcione?

Cheers,

Respuesta

29

No están pasando el token CSRF con POSTAL. Intenta hacer lo que hice en datos. Eso es para obtener el token csrf (o su propio método) y pasarlo en sus argumentos.

$.ajax({ 
    url : url, 
    type: "POST", 
    data : {csrfmiddlewaretoken: document.getElementsByName('csrfmiddlewaretoken')[0].value}, 
    dataType : "json", 
    success: function(data){ 
     // do something 
    } 
}); 
+0

Funcionó como un encanto. Muchas gracias :-) – TheMonkeyMan

+4

Este enfoque está bien, pero si estás haciendo muchas solicitudes ajax, puede que le resulte más conveniente pasar el token CSRF como encabezado. Para obtener más información, consulte [django docs] (https://docs.djangoproject.com/en/dev/ref/contrib/csrf/#ajax). – Alasdair

+7

Encuentro 'data: {..., 'csrfmiddlewaretoken': '{{csrf_token}}'}, ...' más sencillo. – Tuttle

5

Desde el docs en CSRF y AJAX:

El token CSRF también está presente en el DOM, pero sólo si se incluye explícitamente el uso de csrf_token en una plantilla. La cookie contiene el token canónico; el CsrfViewMiddleware preferirá la cookie al token en el DOM. De todos modos, está garantizado que tienes la cookie si el token está presente en el DOM, así que ¡debes usar la cookie!

Ejemplo(también de los docs)

// using jQuery 
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'); 

o cualquier otra manera de interactuar con las galletas se podrían utilizar.

6

Si está enviando un cuerpo de solicitud POST, quizás sea más fácil agregar el token csrf como un encabezado de solicitud. Encuentro que este enfoque es más fácil de leer, ya que no satura el cuerpo de la solicitud con un token. La mayoría de las solicitudes AJAX enviarán el token csrf como encabezado, como lo sugiere la documentación de Django.

function startTest(testId) { 
    var payload = JSON.stringify({ 
    test_id : testId 
    }); 
    $.ajax({ 
    url: "/test-service/", 
    method: "POST", 
    headers: {'X-CSRFToken': '{{ csrf_token }}'}, 
    data: payload, 
    dataType: "json" 
    }).done(function(response) { 
    console.log(response.id + " " + response.name); 
    }).fail(function (error) { 
     console.log(error); 
    }); 
}