如何将 signalR 与 Redux-observable 一起使用？答案

【问题标题】：How to use signalR with Redux-observable?如何将 signalR 与 Redux-observable 一起使用？
【发布时间】：2019-01-23 13:15:48
【问题描述】：

我已经创建了 Angular SPA 应用程序。我在服务器端使用 ASP.net 核心，客户端状态由 redux-observable 使用 action-reducer-epics 处理。

结构是这样的：我已经配置了存储、根史诗和根减速器，然后每个组件都有自己的史诗、减速器和服务文件。

我想在 redux-observable 中容纳 signalR，但无法正确集成它。

【问题讨论】：

一些代码和对您的问题的正确描述肯定会有所帮助。
确定我也会发布代码

标签： .net asp.net-core redux redux-observable asp.net-core-signalr

【解决方案1】：

首先将您的中心事件作为可观察的。我调整了 this code 以对抗 ASP.NET Core SignalR。

然后创建一个史诗来启动集线器（我正在使用 typescript），在启动时在某处分派该操作。

const startNotificationHubEpic: Epic<RootAction, RootAction, RootState, Services> = (action$, store, { notificationHub }) => {
    return action$.pipe(
       filter(isActionOf(startNotificationHub.request)),
       switchMap(action => 
            from(notificationHub.start()).pipe(
                   map(() => startNotificationHub.success()),
                   catchError(err => of(startNotificationHub.failure(err)))
        )));
}

最后使用 startNotificationHub.success 操作开始在集线器上为您感兴趣的每个事件监听 rsjx 事件流。

const listenForMessageEpic: Epic<RootAction, RootAction, RootState, Services> = (action$, store, { notificationHub }) => {
    return action$.pipe(
        filter(isActionOf(startNotificationHub.success)),            
        switchMap(act => 
            notificationHub.on("Message", (messag: string) => ({message})).pipe(
                map(notif => onMessage(notif))
        )));
}

反过来，onMessage 操作可以被另一个史诗使用或在 reducer 中用于将通知数据传递给组件。

【讨论】：

【解决方案2】：

我制作了一个小型库来使用 redux、rxjs 和 redux-observable 处理实时 SignalR (.NET Core) 事件：redux-observable-signalr-core。它无需任何额外设置即可实现自动重新连接。它非常灵活，因此您可以使用它来涵盖几乎任何场景，或者只需查看源代码即可构建您自己的解决方案。

【讨论】：

这个库似乎没有维护。没有文档，我在尝试构建时遇到错误。似乎不值得使用。