Cookies, SSR, and CSR
The app that I'm buliding will have 3 URLs:
- www.mywebsite.com = marketing site
- app.mywebsite.com = the application
- api.mywebsite.com = REST API
The normal flow is like this:
1) User goes to www.mywebsite.com and clicks "login"
2) User is redirected to www.mywebsite.com/login
3) User fills out credentials and hits submit
4) Request is made to api.mywebsite.com/login
5) User receives access and refresh tokens via httpOnly cookies and is redirected to app.mywebsite.com/dashboard
6) app.mywebsite.com/dashboard makes calls to api.mywebsite.com/dashboard to fetch homepage data
Other details:
- I would like www.mywebsite.com and all of its routes to be statically generated HTML files.
- I would like app.mywebsite.com and all of its routes to be a SPA. Not sure yet if I should go with CSR or SSR.
Questions:
1) Is what I have written under "other details" a good idea or should I make everything one SPA?
2) When www.mywebsite.com/login receives tokens via httpOnly cookies, should it use
navigate(...) to redirect to app.mywebsite.com/dashboard?
3) If I'm using SSR, how would the server that is rendering app.mywebsite.com get the access and refresh tokens that were sent by the browser?
4) If I am doing SSR, where should I host app.mywebsite.com? Should I run my own nodejs server in a cloud? Should I host on something like Vercel? Can I host on Cloudflare Pages? I'm totally new to SSR, and like the lowest cost/fuss option.
5) If I'm doing CSR, how does the request flow to app.mywebsite.com/settings/password work? I'm guessing whoever is hosting my SPA will send the entire SPA? Will the browser load the SPA and know to navigate to /settings/password? Or will it load on the root ("/")?1 Reply
hello there.
1. it depends, if you want to SEO and a better experience for user, SSR is my advice. There is very few cost to build SSR in solidstart.
2. I prefer to use Action which throws a redirect with revalidation that
updates the data in your route. It works in the server, and can work in the client as well.
3. Every request takes the token inside the cookie automatically, so you do not pay attention to configure it. There are 2 methods to handle the token, one is base64 format saved in cookie directly, the other one is encode in server and saved in cookie later. The second method is safer and creates enough context for single flight even the user signs out.
4. In serverless cloud server, such as vercel, zeabur even deno deploy, you can deploy solidstart just one click. If you use a VPS, you should install node or deno at first.
5. In CSR, sometimes it is as similar as SSR, your token will be sent to the server directly, and then get the response. In SSR, your authentication API will be fetch from the server. you can use navigate to redirect however I do not like to use it.
I think my response is helpful. If you want to some details, plz let me know.