4

在使用@rails/ujs（无 jquery）的 Rails 6.1 应用程序中，我试图拦截 ajax 请求何时触发以及何时完成。

我已将以下内容添加到我的application.js

document.addEventListener("turbolinks:load", () => {
  document.addEventListener("ajax:send", () => {
    console.log('SEND')
  })
  document.addEventListener("ajax:complete", () => {
    console.log('COMPLETE')
  })
})

当我解雇他们时，我正确地得到SEND了，但是当他们结束时，我没有得到 (expected) COMPLETE。

我在这里错过了什么吗？

4

1 回答 1

0

我有一些个人想法来调查这种错误。

线索：SEND 正常工作，因为它在控制台中打印（确保控制台中没有错误消息）
想法：打开 Network 选项卡并检查请求是否处于挂起状态。 在此处输入图像描述

因为ajax:complete无论服务器响应的结果如何都会触发，所以我们可以使用它来查找下一步。

情况A：请求待处理。
nextStep：尝试找出请求卡在服务器端的原因

情况B：请求响应但事件仍然没有触发
nextStep：尝试查找是否有任何脚本已经在监听 rails-ujs 事件

  • 阿贾克斯：成功
  • 阿贾克斯：错误
  • 阿贾克斯：完成

并在里面打电话event.preventDefault()。您还可以打开Source选项卡并选中复选框以在某些特定的 XHR 相关事件处添加断点：

  • 错误
  • 加载
  • 负载端

在此处输入图像描述 https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest#events

并尝试查找那里是否有任何错误或调用event.preventDefault()

我测试了你的代码，它在我的机器上运行良好，所以我只想给你一些想法供你参考。

于 2021-12-24T12:06:12.633 回答