RubyonRails ajax DELETE请求未到达后端

Question

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

Turbolinks.clearCache((Turbolinks.访问("；http://localhost:3000/session/new"，{"动作"："替换"}(

我的开发人员控制台中没有任何错误。你对如何解决这个问题有什么想法吗？

Rails版本为6，Turbolinks版本为5.0.1

这是我路由.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

我发现，由于Rail的auth令牌和其他一些难以解决的问题，这种ajax是一个很难解决的问题。

我通常发现添加一个带有隐藏提交按钮的隐藏表单会更快/更容易。稍微混乱一点，但要想让它正常工作，你需要做的事情要少得多，所以我通常在原型设计过程中以及第一次需要它正常工作时使用它。

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

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

Answer 2

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

Turbolinks.clearCache((>Turbolinks.访问("；http://localhost:3000/session/new"，{"动作"："替换"}(

从上面的观察来看，TurboLinks似乎正在拦截您的请求，并试图在响应中完成它的任务，

从您发布的ajax调用中，

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

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

，这是你可以尝试的

将ajax选项中的dataType字段添加为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文件进行响应。