Ruby on Rails ajax DELETE 请求未到达后端

Question

我有一个 ajax 请求未到达我的后端函数。该请求的状态为 200，并进入成功状态，但它从未命中我的后端控制器方法。在我的回复中我得到这个：

Turbolinks.clearCache() Turbolinks.visit("http://localhost:3000/session/new", {"action":"replace"})

我在开发控制台中没有收到任何错误。关于如何解决这个问题有什么想法吗？

Rails 版本是 6，Turbolinks 版本是 5.0.1

这是我的 routes.rb 文件中的路线

  resources :analyses_groups, :controller => "analyses/groups" do
    delete "remove_mitigation_mapping", on: :collection;
    post "add_mitigation_mapping", on: :collection;
  end
 

我的 ajax 调用位于我的 index.html.erb 文件中

    $(document).ready(function() {
    
      $("button.delete_mapping_item").on('click', removeMapping);

    });
    
    var removeMapping = function (event) {
              event.stopPropagation();
            
              var button        = $(this);
              var mapping_type  = button.data("mapping_type");
              var mapping_index = button.data("mapping_index");
              var mapping_name  = button.parents("span").text();
            
              if (confirm("Are you sure you want to remove " + mapping_name + "from " + mapping_type + "?")) {
                $("#shade").show();
            
                // Get mitigation_matrix_id
                var row                  = $(this).parents("tr").parents("tr")[0]
                var mitigation_matrix_id = $(row).find(".mitigation_matrix_id").text()
            
                // Set up params for URL
                var param_hash = {
                  "mitigation_matrix_id": mitigation_matrix_id,
                  "mapping_type": mapping_type,
                  "mapping_index": mapping_index,
                }
            
                $.ajax({
                    url: "/analyses_groups/remove_mitigation_mapping" + '?' + $.param(param_hash),
                    type: "DELETE",
                    success: function(data) {
                        console.log("success");
                        console.log(data);
                      button.closest("tr").remove();
                      $("#shade").hide();
                    },
                    error: function(data) {
                      $("#shade").hide();
                    }
                });
              }
            }

Answer 1

我发现这种 ajax 很难正确处理，因为 Rail 的身份验证令牌和其他一些混乱的问题需要正确处理才能正常工作。

我通常发现添加带有隐藏提交按钮的隐藏表单会更快/更容易。稍微混乱一些，但要让它正常工作所需的东西要少得多，所以我通常在原型设计期间以及当我需要它第一次就正常工作时使用它。

基本上只需添加一个 display:none 表单，其中包含 Mitigation_matrix_id、mapping_type 和 mapping_index 的隐藏字段。通过JS设置，然后用JS点击隐藏的提交按钮。对于 JS 响应，您只需设置一个 action.js.erb 文件来处理它。该表单应该是 ajax 表单，因此使用 remote: true, local: false （这适用于各种 Rails 应用程序，但严格来说，对于给定版本的 Rails，您只需要两者之一）。

注意：还有一个专门的 Rails.ajax 方法也可以使用，但是您还需要正确处理一些事情才能使其正常工作。

Answer 2

在我的回复中我得到了这个：

Turbolinks.clearCache() > Turbolinks.visit("http://localhost:3000/session/new", {"action":"replace"})

从上面的观察来看，TurboLinks 似乎正在拦截您的请求并尝试要在响应中执行此操作，

从您发布的 ajax 调用中，

success: function(data) {
    console.log("success");
    console.log(data);
    button.closest("tr").remove();
    $("#shade").hide();
 },

我可以放心地猜测您正在期待 json 响应，

这是您可以尝试的方法，

在中添加 dataType 字段ajax选项为json，如下：

$.ajax({
  url: "/analyses_groups/remove_mitigation_mapping" + '?' + $.param(param_hash),
  type: "DELETE",
  dataType: 'json',//added the expected response type
  success: function(data) {
    console.log("success");
    console.log(data);
    button.closest("tr").remove();
    $("#shade").hide();
  },
  error: function(data) {
    $("#shade").hide();
  }
});

另外，在控制器代码中，如果没有，请使用json响应进行响应，并且不要使用redirect_to，或者不要使用html或js文件进行响应。