@angular @ngrx/effects HTTP 请求不断取消和重试答案

【问题标题】：@angular @ngrx/effects HTTP Request Keeps Canceling and Retrying@angular @ngrx/effects HTTP 请求不断取消和重试
【发布时间】：2018-01-07 08:47:08
【问题描述】：

我有一个非常简单的效果，它发出一个 http 请求并在完成时分派一个动作。

HTTP 请求不断地被取消和一遍又一遍地重新创建。

最初我认为是 switchMap 导致了问题（取消了 observable），所以我尝试使用 mergeMap（结果相同）。

下面是我的效果代码。

signIn$ = this.actions$
  .ofType(ACTIONS.AUTH.SIGN_IN)
  .map(toPayload)
  .map(payload => toInput(payload))
  .switchMap(input => this.http
      .post<Output>(`${GLOBALS.endpoint}/auth/authenticate`, input)
      .map(output => ({ type: ACTIONS.APP.PUSH_NOTIFICATION, payload: "test" }))
      .catch(error => of(createAction(ACTIONS.APP.LOG_EXCEPTION, error)))
  );

上面的代码编译没有错误并且按预期工作，除了它不断取消和重新发出 http 请求。

我不知道这是否重要，但我使用的是 HttpClient (@angular/common/http)，而不是 @angular/http。

任何建议将不胜感激！

【问题讨论】：

这里的问题最终是我编写的一个 ng HTTP 拦截器。我绑定到我的 store observable 以检索自定义 HTTP 标头的状态。我绑定到该 observable 的方式存在问题，导致 http 请求多次发送存储更新（由效果触发）。错误根本不在效果代码中。只是为了这篇文章的未来读者:)

标签： angular ngrx ngrx-effects

【解决方案1】：

“switchMap”有自己的“退订”机制取消 api 请求，

使用“flatMap”（或 mergeMap）应该适合您。

【讨论】：

【解决方案2】：

您似乎在短时间内多次发送相同的请求。尝试将请求限制为仅在令牌更改时。以下可能有效：

signIn$ = this.actions$
  .ofType(ACTIONS.AUTH.SIGN_IN)
  .distinctUntilChanged()
  .map(payload => toInput(payload))
  .switchMap(input => this.http
      .post<Output>(`${GLOBALS.endpoint}/auth/authenticate`, input)
      .map(output => ({ type: ACTIONS.APP.PUSH_NOTIFICATION, payload: "test" }))
      .catch(error => of(createAction(ACTIONS.APP.LOG_EXCEPTION, error)))
  );

【讨论】：

感谢您的意见！我试过了，但我仍然遇到同样的问题。如果我使用 .do(console.log) 而不是 distinctUntilChanged()，它只会触发一次（如果有帮助的话）。似乎多次触发的部分是 .switchMap。在 there 下或之后的任何 .do 日志都会重复触发。
试试distinctUntilKeyChanged('email') 或类似的东西