时间戳

首页 > 解决方案 > RxJS：批量请求和共享响应

javascript - RxJS：批量请求和共享响应

问题描述

假设我有一个函数fetchUser，它以参数为参数userId并返回一个可观察的 user。

由于我经常调用此方法，因此我想批量处理 id 以执行一个具有多个 id 的请求！

我的麻烦就从这里开始...

如果不在fetchUser.

import { Subject, from } from "rxjs"
import { bufferTime, mergeMap, map, toArray, filter, take, share } from "rxjs/operators"

const functionThatSimulateAFetch = (userIds: string[]) => from(userIds).pipe(
    map((userId) => ({ id: userId, name: "George" })),
    toArray(),
)

const userToFetch$ = new Subject<string>()

const fetchedUser$ = userToFetch$.pipe(
    bufferTime(1000),
    mergeMap((userIds) => functionThatSimulateAFetch(userIds)),
    share(),
)

const fetchUser = (userId: string) => {
    const observable = fetchedUser$.pipe(
        map((users) => users.find((user) => user.id === userId)),
        filter((user) => !!user),
        take(1),
    )
    userToFetch$.next(userId)
    return observable
}

但这很丑陋，而且有很多麻烦：

更一般地说：我不知道如何解决需要使用 RxJS共享资源的问题。很难找到 RxJS 的高级示例。

标签： javascripttypescriptrxjsrxjs6

解决方案

我认为@Biggy 是对的。

这是我理解问题和你想要达到的目标的方式

  1. 您的应用中有不同的地方要获取用户
  2. 您不想一直触发 fetch 请求，而是希望缓冲它们并以一定的时间间隔发送它们，比如说 1 秒
  3. 您想取消某个缓冲区并避免在 1 秒间隔内触发获取一批用户的请求
  4. 同时，如果有人（我们称之为X 位置的代码）请求了一个用户，而仅仅几毫秒后其他人，即Y 位置的代码取消了整批请求，那么X 位置的代码必须接收某种类型的请求答案，让我们说一个null
  5. 此外，如果在缓冲时间的间隔内，您可能希望能够要求获取用户然后改变主意，并避免获取此用户（我不确定这是否真的是您想要的，但它似乎以某种方式从你的问题中浮现出来

如果这一切都是真的，那么您可能必须有某种排队机制，正如 Buggy 所建议的那样。

那么这种机制可能有很多实现。

推荐阅读