在 react/redux 应用程序中管理 webRTC 状态(流)

managing webRTC state (streams) in a react/redux app

我正在开发一个带有 React 的视频聊天应用程序,并使用 redux 进行状态管理。目前使用 agora for webRTC。随着 webRTC 相关事件的发生(流被添加、删除以及更多),状态应该被更新并发送到 need/depend 上的所有组件。

然而,单独使用 redux 并不是为了这个。正如 this SO question, and by 中所讨论的,redux 不适用于 类,因此存储 webRTC 流不是一个好主意。

我想我应该手动存储和管理自己的 webRTC 状态(某处,idk where

不过,我自己还是很难理解如何存储 webRTC 流:

  1. 我相信使用上下文 API 会导致我的所有组件在每次发生流 changes/is added/is removed/anything 其他相关事件时呈现。
  2. 在 React 函数组件上管理 webRTC 状态很快就会变成一场噩梦,因为我必须在顶层进行,并且几乎在所有地方都将其传递下去。
  3. redux-saga 被认为是一个潜在的救世主,但我对此有点陌生,我不清楚这有什么帮助,因为它似乎主要处理副作用和异步调用。我需要一个水货店(AFAI懂)

底线:

有人可以给出一个很好的详细解释,或者给我指出一个代码可以很好地做到这一点的回购协议吗?

我在 redux-saga 文档中找到了一个很好的基本示例代码,它管理来自 websocket 的事件 - 这与来自 webRTC 客户端的事件没有太大区别。

https://redux-saga.js.org/docs/advanced/Channels.html