express-session compatibility issues

[leaky]

I've integrated express-session with hopes of using sessions to store user-specific data, however it seems that the session ID is not persisting at all when running the application in development mode on port 3000.

I have integrated express-session like so below:

server.use(session({
    secret: "keyboardcat",
    resave: true,
    saveUninitialized: true,
    proxy: true,
    cookie: {
        secure: false,
        maxAge: 6000000
    }
}));

server.use(function (req, res, next) {
    console.log(req.sessionID);
    next();
});

req.sessionID has a different value on every single request. If (still in development) I switch to port 5000 then the sessionID does seem to be persisting but there's no JS functionality on 5000.

I thought that browsersync could have been the issue but after running npm run build and then node build/server.js the session ID is still not persisting, it only persists on 5000 in development.

[langpavel]

Hi @leaky

1. Do you use express cookie middleware? It's required before session middleware.
2. If you use isomorphic fetch (src/core/fetch) there is no support for passing down cookies, but you can hack yourself or open another issue. (More info about fetch)

Please describe more your scenario.

Thanks

[leaky]

Hi @langpavel

I've managed to fix this issue by adding {credentials: 'include'} tofetch` requests.

Another incurring factor was that I had modified the Link component to perform window.location = xxx on each page navigation rather than history change as I wanted to have a "loading" animator but as far as I could see there was no way to turn a loading notification on/off on page navigation? (please correct me if I am wrong!)

I'm using react-starter-kit to trial-build an eCommerce store.

[langpavel]

@leaky You still cannot do feth from server because it still doesn't know credentials.

For your second question please open new issue. Thanks!

[leaky]

@langpavel what is the alternative to fetch and will not effect session?

[langpavel]

fetch is best alternative itself today. You just must provide cookie header on server to your fetch wrapper. For example you can provide fetch function when handling your request on server by some kind of express middleware and then inject this concrete version to your action creators or React's context. On client just inject fetch as is. Then you should use fetch in your action creators consistently. May be I will prepare PR for this, but I don't promise anything :-)
If you like this idea, you can start and I will review your PR.

Do you using redux?

[Jaikant]

@leaky Did you fix this problem with express-session?

[IDrinkMoreWater]

@leaky @Jaikant https://tonyspiro.com/how-to-keep-session-data-after-fetch-post-with-express/#comment-2544007117

[ulani]

@leaky thank you very much for crating this issue! Unfortunately, we have close it due to inactivity. Feel free to re-open it or join our Discord channel for discussion.

NOTE: The main branch has been updated with React Starter Kit v2, using JAM-style architecture.