search

erikras / react-redux-universal-hot-example

A starter boilerplate for a universal webapp using express, react, redux, webpack, and react-transform
MIT License
11.99k stars 2.5k forks source link

Is it possible to replace cookie sessions with localStorage? #653

Open Dindaleon opened 8 years ago

Dindaleon commented 8 years ago

I am working on an universal app and we cannot depend on cookies. Is it possible to have the user session saved in local storage instead of a cookie?

I know localStorage cannot be used on the server side, so perhaps, the user session could be loaded after server side rendering and before client side rendering. Would this be ok?

adailey14 commented 8 years ago

You may want to refer to issue #608 discussing authentication using cookies vs localStore. It has some links about why you should use cookies for storing authentication tokens. Also it shows an implementation using the react-cookie library which allows you to use cookies on the server side.

You can definitely use localStorage but in order to have the server rendering the same thing as the client, you need to get anything in your localStorage needed for rendering up to the server somehow - and cookies are the logical way. If you want to store a lot of stuff in localStorage for rendering you'll probably have to give up on accurate server side rendering of those parts (but maybe that's ok for you - you only need server side rendering for SEO purposes and speedy initial page loads).

Out of curiosity, why can you not depend on cookies?

Dindaleon commented 8 years ago

Very nice answer @adailey14 , thank you.

Because I am looking to have authentication routes that work for a web and mobile app. For what I have read so far, I understand that we cannot use cookies in mobile apps, am I wrong?

adailey14 commented 8 years ago

@Dindaleon Yeah I think cookies in a mobile app are a tricky proposition - not recommended. Personally I am planning to use a react-native implementation for a mobile app, rather than trying to use this project directly within a mobile app. I suspect there will be a number of tricky pieces to get this code to work right as a mobile app, considering the code would have to run in a server side environment, a browser, and a mobile app. I wonder if anyone else has tried that yet?

I'm thinking you would end up wrapping this code in an app container of some kind, like phonegap, or your own custom container. The client side code would be downloaded with the app, so the app would only ever make API calls. I think this would mean you would never trigger a server side render from your mobile app, right?

So in that case... I think you would be clear to just use localStorage and include the auth information in your api call headers. So probably you would want your code to detect if it's in the mobile app vs a browser, and use a purely localStore strategy for the mobile app, but include a setting a cookie strategy in the browser to allow server side rendering to work. Maybe that 'detection' should happen at build time.

If you're not doing the 'container' route, and instead your 'app' is really just a wrapped web browser that will be pulling all the code from the server, then you would need to do something where you copy auth info from localStorage into a cookie before each request so you get server side rendering to work serving your app.

These are all just guesses, I don't know if there is a best practice here. Would love to hear if anyone else has experience doing any of the above.

Dindaleon commented 8 years ago

@adailey14 I am planning on using react-native as well. I migh just create a new route for the mobile app that only uses localstorage. I am working with a hapi server.