Rails 5 InvalidAuthenticityToken 咖啡脚本

Question

我在 ajax 请求 select 输入的更改事件时遇到问题。

我的实际脚本适用于事件：

$ ->
  $(document).ready ->
    $(document).on 'change', '#empresa_id', (evt) ->
      $.ajax '/empleados/find_branches',
        type: 'POST'
        dataType: 'json'
        data: {
          id: $("#empresa_id option:selected").val()
        }
        error: (jqXHR, textStatus, errorThrown) ->
          console.log(jqXHR)
          console.log(textStatus)
          console.log(errorThrown)
          console.log("AJAX Error: #{textStatus}")
        success: (data, textStatus, jqXHR) ->
          for key, value of data['data']
            $('#sucursales_id').append($('<option>').text(value.nombre).attr('value', value.id));

我有 application.html.erb:

<%= csrf_meta_tags %>
<%= csp_meta_tag %>
<%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %>

在 application.js:

//= require rails-ujs
//= require jquery3
//= require activestorage
//= require turbolinks
//= require_tree .
//= require popper
//= require bootstrap

但我仍然得到：

Can't verify CSRF token authenticity.
Completed 422 Unprocessable Entity in 1ms (ActiveRecord: 0.0ms)
ActionController::InvalidAuthenticityToken (ActionController::InvalidAuthenticityToken)

我知道 //= require rails-ujs 实际上在请求的 header 上添加了令牌，但在浏览器上不显示它。

我已经做了耙子 assets:precompile。

我是不是漏掉了什么？

:

Answer 1

$ ->
  $(document).ready ->
    $(document).on 'change', '#empresa_id', (evt) ->
      $.ajax '/empleados/find_branches',
        type: 'POST'
        dataType: 'json'
        beforeSend: (xhr) -> xhr.setRequestHeader('X-CSRF-Token', $('meta[name="csrf-token"]').attr('content'))
        headers: {
              'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content')
        }
        data: {
          id: $("#empresa_id option:selected").val()
        }
        error: (jqXHR, textStatus, errorThrown) ->
          console.log(jqXHR)
          console.log(textStatus)
          console.log(errorThrown)
          console.log("AJAX Error: #{textStatus}")
        success: (data, textStatus, jqXHR) ->
          for key, value of data['data']
            $('#sucursales_id').append($('<option>').text(value.nombre).attr('value', value.id));

添加beforeSend和headers

Rails 5 InvalidAuthenticityToken 咖啡脚本

Rails 5 InvalidAuthenticityToken Coffeescript

ruby-on-rails

coffeescript