I have started moving an app from React to Sapper. I am new to SSR architecture and want to know what the best way is to store the user session and data.

I am using Firebase for my auth and database. After using the client side firebase API to get the session keys and other user data how would I store the data? I have seen some tutorials making a user.js store, but in the Sapper docs I see it remends using the session store. So which is better? And what would be the flow from client side to the server side session store?

E.g. If I were to make a login folder under which I have the svelte ponent and the server side route. Would there be a post "endpoint" that would set the session.user?

I have started moving an app from React to Sapper. I am new to SSR architecture and want to know what the best way is to store the user session and data.

I am using Firebase for my auth and database. After using the client side firebase API to get the session keys and other user data how would I store the data? I have seen some tutorials making a user.js store, but in the Sapper docs I see it remends using the session store. So which is better? And what would be the flow from client side to the server side session store?

E.g. If I were to make a login folder under which I have the svelte ponent and the server side route. Would there be a post "endpoint" that would set the session.user?

• javascript
• firebase
• server-side-rendering
• svelte
• sapper

2 Answers 2

It's a bit tricky. I managed to get this working with both client and server using a authentication middleware

https://github./itswadesh/sapper-emerce/blob/master/src/server.js

The best way I have found so far is using JWT's:

Either get a JWT from a third party (Google, facebook, github) or sign your own.

server.js:

express()
    .use(
        pression({
            threshold: 0
        }),
        sirv('static', {
            dev
        }),
        cookieParser(),
        bodyParser.json({strict: false}),
        bodyParser.urlencoded({ extended: false }),
        async (req, res, next) => {
            const token = req.cookies['AUTH']
            const profile = token && !dev ? await getBasicUserInfo(token) : false

            return sapper.middleware({
                session: () => {
                    return {
                        authenticated: !!profile,
                        profile
                    }
                }
            })(req, res, next)
        }
    )

then with every request just add 'credentials':'include to your requests to the server.

you will have to verify the token on every request but this method makes you app super scalable