使用Redux构建React应用时在何处存储WebRTC流 [英] Where to store WebRTC streams when building React app with redux
问题描述
我正在构建一个与WebRTC api交互以进行音频/视频调用的React.js应用程序.成功建立呼叫后，将在RTCPeerConnection实例上触发"onaddstream"事件，该实例包含我作为开发人员应该连接到视频元素以向用户显示远程视频的流.
I'm building a React.js application that interacts with the WebRTC apis to do audio/video calling. When a call is successfully established, an 'onaddstream' event is fired on the RTCPeerConnection instance, which contains the stream that I as a developer am supposed to connect to a video element to display the remote video to the user.
我遇到的问题是了解从事件获取流到React组件进行渲染的最佳方法.我通过将流转储到我的redux状态就成功地工作了，但是
Problem I'm having is understanding the best way to get the stream from the event to the React component for rendering. I have it successfully working by just dumping the stream into my redux state, but in this other answer, the creator of redux Dan Abramov mentioned this:
[...]不要在州内使用类.它们不能按原样序列化.[...]只需使用普通对象和数组即可.
[...] don’t use classes inside the state. They are not serializable as is. [...] Just use plain objects and arrays.
这让我想知道，如果我不应该将这些流置于redux状态，是否有更好的方法来响应'onaddstream'事件并更新React组件而不将流置于redux状态?
Which leaves me wondering, if I shouldn't put these streams in the redux state, is there a better way to react to the 'onaddstream' event and get the React component to update without putting the stream in the redux state?
推荐答案
以我的经验，套接字连接之类的东西，以及webrtc之类的东西，非常适合生活在为应用程序手写的中间件中.您可以在此处进行所有连接管理的连接，触发与UI进行通信的操作，并监听来自此处的操作.
In my experience things like socket connections and, as in your case, webrtc things, are well-suited for living inside their own middlewares hand-written for your application. You can wire up all connection management here, fire actions to communicate with UI and listen for actions coming from here.
另一种解决方案是查看 redux saga ，对于处理套接字和webrtc等复杂效果，这似乎是一个不错的选择.
Another solution would be to look on redux saga, which seems to be quite a nice option for handling complex effects as sockets and webrtc.
这篇关于使用Redux构建React应用时在何处存储WebRTC流的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
