我想在新的请求到来时取消我之前的请求答案

【问题标题】：I want to cancel my previous request when newer one comes我想在新的请求到来时取消我之前的请求
【发布时间】：2019-09-16 09:31:43
【问题描述】：

我有一个文本框，我正在对每个输入字符进行 http 调用。但我的问题是我想在用户输入下一个字符时取消我的请求，以防我之前的响应没有到来。

【问题讨论】：

这样的事情可能会帮助您实现您想要的：codinglatte.com/posts/angular/… 还有其他示例，但这可能会让您对每个输入字符上的 http 有一个很好的了解

标签： javascript angular typescript rxjs

【解决方案1】：

您无法按预期方式取消 HTTP 请求；一旦你向服务器发送了一个 HTTP 请求，请求就已经发送了，即使你忽略了响应，服务器仍然会尝试满足请求。

例外：

“流式”HTTP 请求（可以终止）
如果您使用 HTTP 请求触发在服务器上启动的作业，并使用单独的 HTTP 请求取消该作业（但这仍然涉及两个成功 http 请求，而不是取消一个)

您可能想查看throttling 或 JavaScript 中的“去抖动”，其中一个函数可以在每次按键时调用一次，以为条件，如果它在过去没有被调用 N毫秒，例如

[编辑] 需要明确的是，一些工具可以让你“取消”仍在进行中的 HTTP 请求（例如 rxjs，正如评论者所说）。但这并不一定会阻止您的服务器处理调用，如果它已经被服务器接收到，而且，可取消性取决于您的 HTTP 实现。阅读更多here。

【讨论】：

你能告诉我如何处理这种情况吗？如果每个请求都成功，那么它可以增加我正在使用的服务器上的负载。我只是想让我的新请求仅在服务器上进行并取消所有先前的请求。
使用 observables (rxjs) 你可以取消一个 http 请求。
@ManuelPanizzo 有点像，尽管 rxjs 不会阻止服务器接收请求。因此，当您只是将该响应放在地板上并且您的客户端不再需要处理响应数据时，您仍在启动请求，并且您的服务器可能会尝试满足它（例如消耗 CPU 时间） .对于有状态的请求，这不是真正的取消。很高兴知道提问者的用例以确定是否是这种情况。
@somjikatiyar 不幸的是，无法保证您的服务器不会收到任何过时的请求。如果您能承受更多几毫秒的延迟，我建议您在通话中添加延迟，并且仅在自上次通话后没有发生进一步事件时才发出请求。如果这听起来像您需要的，我可以帮助您编写一些示例代码。
大家好，感谢您宝贵的 cmets。我很好地使用了 swichmap，我找到了解决我的问题的替代方案。

【解决方案2】：

您可以使用 rxjs switchMap 运算符来做到这一点

在每次发射时，前一个内部可观察对象（您提供的函数）被取消，新的 observable 是订阅。您可以通过短语 switch to a new 来记住这一点可观察的。这非常适合预输入这样的场景您不再关心上一个请求的响应当一个新的输入到达时

例子：

// RxJS v6+
import { interval, fromEvent } from 'rxjs';
import { switchMap } from 'rxjs/operators';

fromEvent(document, 'click')
  .pipe(
    // restart counter on every click
    switchMap(() => interval(1000))
  )
  .subscribe(console.log);

来自 Angular 大学博客的演示。您可以看到，当新请求到来时，先前的请求会被取消

【讨论】：