纯 JavaScript 的 AJAX 请求出现“ActionController::InvalidCrossOriginRequest”错误

Posted 2023-05-09

【中文标题】纯 JavaScript 的 AJAX 请求出现“ActionController::InvalidCrossOriginRequest”错误

【英文标题】："ActionController::InvalidCrossOriginRequest" error with AJAX request by plain JavaScript

【发布时间】：2018-03-21 14:04:37

【问题描述】：

我有这样的代码：

jQuery.ajax(
  url: url  // Some URL
);

上面的代码运行良好。但是，我需要将此代码转换为纯 JS。所以，我做到了：

var xhttp = new XMLHttpRequest();
xhttp.open("GET", url, true);
xhttp.send();

但是，当 AJAX 请求被触发时，我在 rails 服务器日志中收到此错误：

ActionController::InvalidCrossOriginRequest - 安全警告：一个 另一个站点上的嵌入标签请求受保护的 javascript。 如果您知道自己在做什么，请继续禁用伪造保护 在此操作上允许跨域 JavaScript 嵌入。

注意：当我在link_to(Fix I referred) 中通过format: :js 时遇到了类似的错误。但是，这发生在纯 JavaScript 代码中。

我该如何解决这个问题？

【问题讨论】：

如果 jQuery ajax 有效但 xhttp 无效，您可以在控制台中检查任一请求中的标头，看看它们有什么区别。很可能您的应用程序中有 ajaxSend 的代码，它在发送之前为所有 jquery ajax 调用全局执行，使其适用于 jQuery。

@Fran 这是个好建议。我看到 jQuery 请求有一个额外的请求标头参数为X-Requested-With:XMLHttpRequest。我会试试的。

好的，添加xhttp.setRequestHeader("X-Requested-With", "XMLHttpRequest"); 消除了rails 中的错误。谢谢

【参考方案1】：

添加xhttp.setRequestHeader("X-Requested-With", "XMLHttpRequest"); 修复了rails中的交叉原点错误。

现在，代码如下：

var xhttp = new XMLHttpRequest();

xhttp.open("GET", url, true);
xhttp.setRequestHeader("X-Requested-With", "XMLHttpRequest");
xhttp.send();