在Redux中存储可重用性的Class实例的位置？

Question

我正在尝试在我的React / Redux / redux saga应用程序中实现Pusher的消息库Chatkit，我是Redux的新手。连接到chatkit的代码如下所示：

const chatManager = new ChatManager({
    instanceLocator: 'v1:us1:80215247-1df3-4956-8ba8-9744ffd12161',
    userId: 'sarah',
    tokenProvider: new TokenProvider({ url: 'your.auth.url' })
})

chatManager.connect()
    .then(currentUser => {
        console.log('Successful connection', currentUser)
    })
    .catch(err => {
        console.log('Error on connection', err)
    })

我需要在全局存储chatManager和currentUser对象（它们是带有函数atttached的复杂类的实例），这样我以后可以再次使用它们来加入房间，订阅事件等。

我的第一个想法是，我应该将它存储在Redux中，因为它现在是我的“全球商店”，但我意识到它可能无法工作，因为它不会是我从商店退出的原始对象，它会大概是克隆人。然后我读到显然只有普通对象应该存储在Redux中。

那么，哪些东西不是普通对象但需要全局存储？我不想把它们放在窗口对象上，因为我可能将它转换为React Native应用程序，无论如何它看起来很乱。

Answer 1

根据Redux FAQ entry on storing "connection"-type objects：

在Redux应用程序中，中间件是持久连接（如websockets）的正确位置，原因如下：

• 中间件存在于应用程序的生命周期中
• 与商店本身一样，您可能只需要整个应用程序可以使用的给定连接的单个实例
• 中间件可以自己查看所有已发送的操作和调度操作。这意味着中间件可以采取调度操作并将其转换为通过websocket发送的消息，并在通过websocket接收消息时调度新操作。
• websocket连接实例不可序列化，因此它不属于存储状态本身

编辑

这是我的“示例套接字中间件”示例，更新为延迟创建套接字，直到它看到登录操作：

const createMySocketMiddleware = (url) => {
    let socket;

    return storeAPI => next => action => {
        switch(action.type) {
            case "LOGIN" : {
                socket = createMyWebsocket(url);

                socket.on("message", (message) => {
                    storeAPI.dispatch({
                        type : "SOCKET_MESSAGE_RECEIVED",
                        payload : message
                    });
                });
                break;
            }
            case "SEND_WEBSOCKET_MESSAGE": {
                socket.send(action.payload);
                return;
            }
        }

        return next(action);
    }
}