我正在使用cujojs/rest向我的 (laravel) API 发送请求。我正在寻找一种方法来取消当新请求到来时尚未结束的请求。
客户端上有一个取消方法，这可能是我解决问题所需要的:
我的应用程序显示分页的项目集合，人们可以通过单击“下一个/上一个”按钮来浏览页面。 如果用户快速多次单击“下一步”按钮，每个新页面都会触发新请求。我想确保只有最新的请求才能继续，而所有其他(未完成的)请求都会被中止。
当我使用另一个工具来执行我的请求时，我曾经使用 beforeSend 方法来执行此操作。它将把 xhr 对象添加到一个数组中，并且在触发请求之前，如果它们还没有结束，它将对该数组中的所有 xhr 调用 .abort() 。
既然我切换到了 cujojs/rest，我不知道如何使用 cancel 方法来实现这一点。
当然，我不想在新请求运行之前中止任何请求，只想中止那些利用相同资源的请求，因为我可能在其他地方加载了不相关的数据。
/users?page=1 -> should be canceled
/users?page=2 -> should be canceled
/preferences -> should NOT be canceled
/users?page=3 -> should be canceled
/users?page=4 -> should go through as its the last one
任何帮助将不胜感激。
最佳答案
我不确定，因为据我所知没有适当的文档。但从源代码来看你应该能够做这样的事情
//lets say you defined **this.request** somewhere in the constructor to hold the request value which defaults to empty object {};
fetchCollection: function(id) {
var that = this;
var url = 'collections/' + id;
if( Object.keys( that.request ).length !== 0 ) {
if( 'function' === typeof that.request.cancel )
that.request.cancel();
else
that.request.canceled = true;
//here we should re-assign the default {} value again
that.request = {};
}
that.request.path = url;
return client( that.request ).then(
function(response){
that.collection = response.entity.data;
},
function(response){
console.error(response.status.code, response.status);
}
);
},
如果有效，我可以解释原因。
好的，现在当它起作用时我可以解释为什么使用伪代码:
在执行任何操作之前，在 client( request ) 函数 cujojs 中执行以下操作:
检查 request.canceled 是否存在且等于 true
如果满足条件则中止请求
如果request.canceled不存在，它将继续并进入下一步
- cujojs 定义了 request.cancel 函数，该函数可以在请求发送之前中止请求(我们不关心之后的步骤，因为取消是我们的意图)
现在我们正在做的是使用 JavaScript 固有的能力来通过引用传递变量。 通过引用意味着当你给 create() 函数一个变量 request 时，该函数在其自身内部使用相同的变量，而不是创建一个变量request的全新副本并使用该副本。
我们在这里利用这个的方式是，我们从cujojs外部操作request变量，知道它使用相同的变量，因此我们的操作将直接影响<在执行create()函数时使用strong>request变量cujojs。
现在我们知道 cujojs 有 2 种取消请求的方法，并且我们可以在 create() 函数接收到 request 变量后对其进行简单的检查我们这边:
我们检查 this.request 是否为空(只有在尚未发送请求时才会为空)
如果它不为空，我们将检查 cujojs 是否已经在 request 变量上定义了 .cancel 函数，方法是 < strong>'function' === typeof request.cancel
如果有的话我们可以使用这个函数来取消我们之前发送的请求， 如果没有，我们知道 cujojs 现在正在检查 request 变量上的 .canceled 变量，因此我们将其分配给true 执行 this.request.canceled = true;
取消请求后，我们会分配请求全新值{}，从而失去对之前的引用 request 我们之前操作过的变量
我不太擅长解释事情，但我希望你能理解，了解这些细微差别将对你的发展有很大帮助。
快乐编码
关于javascript - 在 cujojs rest.js 上中止 Xhr，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/32901069/