节点套接字服务器上的多个redux存储

时间:2018-05-02 12:52:02

标签: node.js reactjs redux server-side multistore

我正在学习反应和减少,我正在做一个实际项目,以便面对一些问题。

该项目是一个多人游戏迷宫所以我决定使用socket.io服务器,并且该游戏将限制在迷宫游戏环境中,所以我使用的是房间(io命名空间)。

所有游戏上下文都存储在节点服务器上的redux中,并连接到客户端UI。

因为我有多房间服务器我想为每个房间/游戏提供不同的商店。绝对地,我可以组合减速器,但这意味着很多性能损失,需要一个黑暗的动作和存储架构。

问题是我不知道如何在node.js上创建多商店

目前服务器在这种情况下工作 - >   在客户端连接 - >如果当前房间已满,则会在当前房间分配新游戏

  public generate = (server:SocketIO.Server) =>{
        let newIDGenetator = new Idgenerator();
        let store = redux.createStore(labActionReducer);
        let room = server.of('/room'+this.labs.length);
        let socketHandler =  new SocketHandler(room,store,newIDGenetator);
        this.labs.push(socketHandler);

this is the fonction call for generate a new game :
-> create idgenerator wich is just an incr who return is value cast in string 
-> create a new store 
-> create a io namespace 
-> create a new socketHandler which  implemente :


room.on('connect' , (client,store) => 
    client.on('foo',()=> 
         store.dispatch({type:bar});
    )
)

并监听商店以便将新状态发送给处理室的每个客户

第一个房间运作良好但是当创建第二个根时,客户端会在我尝试获取初始状态时显示第一个房间状态的数据

客户端连接好名称空间

所以我认为createStore不会创建新商店。你可以帮我创建一个独立于第一个的新商店吗?如果需要更多细节,我可以给你项目的gitHub链接。

感谢您阅读:)

编辑:socketHandler代码:

export class SocketHandler{
    private playersId = {};
    private store:Store<Lab,LabActionTypes>;
    constructor(server:Namespace,store:Store<Lab,LabActionTypes>,idgenerator:Idgenerator){
        this.store = store;

        store.subscribe(()=>{
            console.log(this.store.getState());
            for(let playerId in this.playersId){
                let newState = this.store.getState() //utiliser reducer_relatif(state,playerId)
                this.playersId[playerId].emit('gridChanged',newState);
             }
        })

        server.on('connect',(client)=>{
            let newID = idgenerator.generetaId()
            this.playersId[newID]=client;
            store.dispatch(action.NewPlayer(newID));
            NewClient(client,store,this);
        });

    }
    public getPlayerBySocket = (socket:SocketIO.Socket)=>{
        for(let playerId in this.playersId){
            if(this.playersId[playerId]===socket){
                return playerId;
            }
        }
    }
}

export const NewClient = (client: SocketIO.Socket,store:redux.Store<Lab,LabActionTypes>,socketHandler:SocketHandler) => {                 


    client.on('up',()=>{
        let player = socketHandler.getPlayerBySocket(client);
        store.dispatch(action.PlayerMooveUp(player,store));
        console.log(JSON.stringify(store.getState()));
    })

    client.on('down',()=>{
        let player = socketHandler.getPlayerBySocket(client);
        store.dispatch(action.PlayerMooveDown(player,store));
    })

    client.on('left',()=>{
        let player = socketHandler.getPlayerBySocket(client);
        store.dispatch(action.PlayerMooveLeft(player,store));
    })

    client.on('right',()=>{
        let player = socketHandler.getPlayerBySocket(client);
        store.dispatch(action.PlayerMooveRight(player,store));
    })

0 个答案:

没有答案