javascript - respond - La forma correcta de enviar un token de autenticidad con AJAX..?

link_to remote true

Question

Esto funciona pero se detiene porque carece de un token de autenticidad:

$(".ajax-referral").click(function(){
  $.ajax({type: "POST", url: $(this).parent("form").attr("action"), dataType: "script"});
  return false;
});

Así que traté de agregarlo así:

$(".ajax-referral").click(function(){
  $.ajax({type: "POST", url: $(this).parent("form").attr("action") + "?&authenticity_token=" + AUTH_TOKEN, dataType: "script"});
  return false;
});

Y pasa el auth_token correctamente como un param, pero parece perder el resto de mi forma.

De todos modos para lograr tanto el envío de los datos del formulario que funciona, y el token de autenticidad también?

Este es un entorno de rieles. Y tengo esto en mi cabeza.

= javascript_tag "var AUTH_TOKEN = ''#{form_authenticity_token}'';" if protect_against_forgery?

Cosas que he intentado

1.

= hidden_field :authenticity_token, :value => form_authenticity_token

2.

$.ajax({type: "POST", url: $(this).parent("form").attr("action"), dataType: "script", authenticity_token: AUTH_TOKEN});

3.

// Always send the authenticity_token with ajax
$(document).ajaxSend(function(event, request, settings) {
    if ( settings.type != ''GET'' ) {
        settings.data = (settings.data ? settings.data + "&" : "")
            + "authenticity_token=" + encodeURIComponent( AUTH_TOKEN );
    }
});

Answer 1

¡Gracias!

Solo para aclarar el uso más común.

Necesitas la etiqueta js con var AUTH_TOKEN en tu cabeza. Debería ser algo como esto

<%= csrf_meta_tag %>
<%= javascript_tag "var AUTH_TOKEN = ''#{form_authenticity_token}'';" if protect_against_forgery? %>

Y luego simplemente coloque su authenticity_token = AUTH_TOKEN en los datos de ajax si no necesita usar parent (form) o algo como esto.

$.ajax({
  type: ''post'',
  dataType:''text'',
  data: "user_id="+user_id+"&authenticity_token="+AUTH_TOKEN,
  url:''/follow/unfollow''
})

¡Gracias a los chicos de arriba por compartir este conocimiento!

Answer 2

Acabo de toparme con este problema, pero probé este enfoque en mi archivo application.js:

$(document).ajaxSend(function(e, xhr, options) {
  if (options.data == null) {
    options.data = {};
  }
  options.data[''authenticity_token''] = token;
});

Esta es la pregunta original de la que surgió la idea: ajaxEnviar pregunta

Answer 3

El simple uso de form_tag incluye automáticamente el parámetro token CSRF. Rails admite "Javascript discreto", lo que significa que el formulario se enviará a través de AJAX. Las acciones del controlador admiten el bloque "responder_ a" y puede usar la extensión .js.erb para realizar cambios en la página web en respuesta al envío de formularios.

Answer 4

En realidad, estás leyendo el atributo action of form y enviando una solicitud post ajax a él. para enviar los datos del formulario debe enviar el formulario o puede serializar los datos del formulario y enviarlo en una solicitud ajax como

$(".ajax-referral").click(function(){
  $.ajax({
      type: "POST", 
      url: $(this).parent("form").attr("action") + "?&authenticity_token=" + AUTH_TOKEN, 
      data:$(this).parent("form").serialize(),
      dataType: "script"
      });
  return false;
});

Hacer esto serializará los datos de su formulario y lo enviará junto con la solicitud ajax y el token de autenticidad ya se está enviando a través de la cadena de consulta.

Answer 5

Este token también aparece en una de las etiquetas "meta" en el encabezado del archivo de diseño application.html.erb de forma predeterminada si tiene el siguiente ERB en la parte superior:

<%= csrf_meta_tag %>

Que ERB aproximadamente rinde a:

<meta content="abc123blahblahauthenticitytoken" name="csrf-token">

Luego puede tomarlo usando jQuery con el siguiente código:

var AUTH_TOKEN = $(''meta[name=csrf-token]'').attr(''content'');

Answer 6

Ninguno de estos funcionó para mí hasta que establecí el valor X-CSRF-Token en el encabezado de solicitud a través de JS de esta manera:

request.setRequestHeader(''X-CSRF-Token'', token)

token por supuesto, siendo el token de CSRF. Lo obtuve de la etiqueta <meta name="csrf-token"> y no encodeURIComponent()

Actualización ya que esto está resultando útil para algunos

Así que en general:

var token = document.querySelector(''meta[name="csrf-token"]'').content
request.setRequestHeader(''X-CSRF-Token'', token)

Answer 7

Puede incluir AUTH_TOKEN en el formulario en sí, como una entrada oculta.

<input type="hidden" name="AUTH_TOKEN">1234abcd</input>