Home

Hi,
I have an Express backend that I use to expose an api to my Nuxt app. On the server, the session handling is set up like this:

...
app.use(session({
    store:             new RedisStore({
        client: redisClientSession
    }),
    secret:            serverConf.sessionSecret,
    resave:            true,
    saveUninitialized: true,
}));

app.use(function (req, res, next) {
    res.setHeader('Access-Control-Allow-Credentials', true);
    res.setHeader("Access-Control-Allow-Origin", "http://localhost:3100");
    res.locals.session    = req.session;
    req.loggedUserId = req.session && req.session.user ? req.session.user.id : null;
    next();
});
...

This is some come that has always worked for me and in fact it works just ok when nuxt requests are client side.

On nuxt.conf.js I have this:

    serverMiddleware: [
        session({
            store:             new RedisStore({
                client: redisClientSession
            }),
            secret:            serverConf.sessionSecret,
            resave:            true,
            saveUninitialized: true,
        })
    ]

I have a page with the following code:

import axios from 'axios';

    export default {
        async asyncData ({ req, params }, callback) {                
                const { data: posts } = await axios.get(`http://localhost:3001/api/p?userId=${user.id}`;
                callback(null, { posts });
        }

When I navigate to a page, on the server I see that the user is correctly authenticated. The problem is when the call is generated by the client (eg. I navigate to that page with a link) but the session credentials are not set when asyncData is executed by the server (eg. I load the page from the browser). In fact, analyzing the request received by the server, the session cookies is not set. I tried adding the options withCredentials: true to axios but with no result.

The only working solution is to manually seat the appropriate header like this:

        import cookie from 'cookie';
        async asyncData ({ req, params }, callback) {

                const parsedCookie = cookie.parse(req.headers.cookie);
                const { data: posts } = await axios.get(`http://localhost:3001/api/p?userId=${user.id}`, {
                    headers: {
                        cookie: `connect.sid=${parsedCookie['connect.sid']}`
                    }
                });
                callback(null, { posts });
      }

Isn’t this something that should already be automated or automatable? Am I setting the session handling wrong? Thanks