Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

How would I use this with socket.io? #4

Open
justinireland opened this issue Oct 23, 2016 · 3 comments
Open

How would I use this with socket.io? #4

justinireland opened this issue Oct 23, 2016 · 3 comments

Comments

@justinireland
Copy link

I'm a little confused by the documentation how I would go about using this for a socket event instead of a fetch request.

For example, I am using socket.io and have setup a special channel called 'getInitialState' to hydrate the initialState from the server. I'm also using socketIoMiddleware for dispatching actions to the server.

The following code doesnt seem to ever resolve even though I have verified the server is emitting the initialState object.

const reducer = asyncInitialState.outerReducer(combineReducers({
    ...rootReducer,
    asyncInitialState: asyncInitialState.innerReducer,
}))

socket.emit('getInitialState')

const loadStore = () => {
    return new Promise(resolve => {
        socket.on('getInitialState', (initialState) => resolve(initialState))
    })
}

const storeCreator = applyMiddleware(
    asyncInitialState.middleware(loadStore),
    socketIoMiddleware(socket)
)
const store = storeCreator(reducer)
@KELiON
Copy link
Owner

KELiON commented Oct 24, 2016

@justinireland Hello! For me your code looks good. I have few questions:

  1. What do you have in rootReducer? Make sure that it is object with functions in values, but not real reducer function.
  2. You've verified that the server is emitting the initialState object, but can you make sure that you are subscribing to this channel before you receive this message? If so replacing subscriber to
    socket.on('getInitialState', (initialState) => console.log(initialState)) should show your initial state in console
  3. If you see your initial state in console, do you see some errors there? Do you see action redux-async-initial-state/STATE_LOADING_DONE in redux logger?

@justinireland
Copy link
Author

  1. my rootReducer is the combined export of my redux modules - not the result of combineReducers() because I see you are doing that in outerReducer().
  2. If I try to put the emitter in the loadStore function like this:
const loadStore = () => {
    socket.emit('getInitialState')
    return new Promise(resolve => {
        socket.on('getInitialState', (initialState) => {
            console.log(initialState)
            return (initialState)
        })
            .then(resolve)
    })
}

the emit event never even fires. I suspect the problem is mostly related in how I am trying to emit and subscribe to the channel. I'm not very familiar with promises so I may be doing something obviously wrong.
3) It probably doesnt help that I am not using a redux logger and simply trying to debug in the console...

@KELiON
Copy link
Owner

KELiON commented Oct 26, 2016

@justinireland so, as I said probably you are subscribing to this event after it is fired. I'd try to do something like this:

const initialStatePromise = new Promise(resolve => {
  socket.on('getInitialState', resolve);
});

const loadStore = () => {
  socket.emit('getInitialState');
  return initialStatePromise;
};

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants