用AJAX向Rails发送真实性令牌的正确方法

Proper way to send an Authenticity Token with AJAX to Rails

本文关键字：令牌 方法 真实性 AJAX Rails      更新时间：2023-09-26

这可以工作，但会因为缺乏真实性令牌而停止:

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

所以我试着像这样添加:

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

并且它将auth_token作为参数正确地传递，但似乎失去了我的表单的其余部分。

无论如何都要完成发送表单数据的工作，以及真实性令牌?

这是一个rails环境。我脑子里有这个

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

我尝试过的事情

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 );
    }
});

这个标记也已经出现在application.html.erb布局文件头部的一个"meta"标签中，默认情况下，如果您在顶部有以下ERB:

<%= csrf_meta_tag %>

ERB大致呈现为:

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

然后可以使用jQuery抓取它，代码如下:

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

实际上，您正在读取表单的action属性并向其发送post ajax请求。要发送表单数据，你需要提交表单或者你可以序列化表单数据，然后在ajax请求中发送，比如

$(".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;
});

这样做将序列化您的表单数据，并发送它与ajax请求和真实性令牌已经通过查询字符串

发送

这些对我都不起作用，直到我通过JS在请求头上设置X-CSRF-Token值，像这样:

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

token当然是CSRF令牌。我从<meta name="csrf-token">标签得到这个，没有使用encodeURIComponent()

更新，因为这被证明是有用的

So all in all:

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

谢谢!

只是为了更常用的用法而澄清一下。

你需要js标签var AUTH_TOKEN在你的头。应该是这样的

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

然后简单地把你的authenticity_token=AUTH_TOKEN在ajax数据中，如果你不需要使用parent(form)或类似的东西。

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

感谢上面的家伙分享这些知识!

在Rails 5.1+中，如果您使用内置的Rails JS帮助器(来自rails-ujs)进行AJAX请求，则会自动添加CSRF令牌，例如:

Rails.ajax({
  url: "/your/url",
  type: "POST",
  data: "a=1&b=2",
  success: function(data) {
    console.log(data);
  }
});

如果需要，这个库还提供了一个帮助器来手动获取CSRF令牌:

Rails.csrfToken();

您可以将AUTH_TOKEN包含在表单本身中，作为隐藏输入。

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

我刚刚遇到了这个问题，但我在我的application.js文件中尝试了这种方法:

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

这是我得到的想法的原始问题:ajaxSend问题

这是一个适用于所有AJAX请求的解决方案。你添加以下到你的all.js(或任何你的网站范围内的javascript文件)

$.ajaxSetup({
    headers: {
        'X-CSRF-Token': document.querySelector('meta[name="csrftoken"]').content
    }
});

这将自动添加令牌作为所有AJAX请求的标头。

简单使用form_tag自动包含CSRF令牌参数。Rails支持"不引人注目的Javascript"，这意味着表单仍将通过AJAX提交。控制器动作支持"respond_to"块，你可以使用.js。动词扩展使网页上的变化，以响应表单提交。

相关文章：