feat: add nuxt-session

[BracketJohn]

Add nuxt-session to the modules overview.

[codesandbox[bot]]

  Open in CodeSandbox Web Editor | VS Code | VS Code Insiders

[atinux]

Thanks! I am not sure about using the sidebase logo for this since it aims to be generic right?

[BracketJohn]

Thanks!

Sure 🎊

I am not sure about using the sidebase logo for this since it aims to be generic right?

I agree - I just wanted to have some sort of logo and didn't have one handy :D

Let me see if I can find a quick solution.

[atinux]

I think you can remove it, I suggested to move to "Security" as category, so this will be using this logo by default:

[BracketJohn]

Added a new logo + changed the category @Atinux - what do you think about this one? ☺️

[BracketJohn]

@Atinux I had to fix the icon location but now it should be good to go 💯

[atinux]

Do you mind improving the playground of your module to show and example of it please?

Also it would be nice to add the badges on the readme to also show the npm version and license.

[BracketJohn]

Sure thing - I'll do that tomorrow though, tonight I'm already off my PC

See you tomorrow 🤙

[BracketJohn]

Do you mind improving the playground of your module to show and example of it please?

done, added a playground + screencap, check it out here: https://github.com/sidebase/nuxt-session#playground

Sneak peak:

Also it would be nice to add the badges on the readme to also show the npm version and license.

Done, badges:

url: https://github.com/sidebase/nuxt-session#readme

---

@Atinux, feel free to check out the playground and see if it works. Otherwise let me know if I should change anything further or whether we're ready to merge 🚀

[atinux]

Checking the playground https://stackblitz.com/github/sidebase/nuxt-session?file=README.md

Increasing session does not work.

[BracketJohn]

I checked it out - I think it has something to do with webcontainers that stackblitz uses + how cookies behave in them.

E.g., when I want to see all cookies on an event I get an empty object every time:

console.log(parseCookies(event)) // -> {}

I tested with firefox and chrome locally and there it worked - I assume it still actually works for all local & deployed projects,. I'll dig into whether stackblitz-webcontainer-cookie-problems are a thing. If this maybe already rings a bell for you, I'd be happy for input.

[BracketJohn]

Heya @Atinux, I created a minimal reproduction to show how cookies do not correctly work within stackblitz. This repro does not contain any nuxt-session code, it's a minimal middleware with 10 LoCS. Here's the url: https://stackblitz.com/edit/nuxt-session-cookie-repro?file=playground/app.vue

To test it:

1. Launch the app,
2. after it starts, click the button
3. Have a look at the server-logs

In stackblitz, we get:

1. cookies start: {}
2. setting cookie hello
3. cookies end:  {}

When testing this locally, I get:

1. cookies start: {
  hello: 'Thu Oct 13 2022 16:27:42 GMT+0200 (Central European Summer Time)'
}
2. setting cookie hello
3. cookies end:  {
  hello: 'Thu Oct 13 2022 16:27:42 GMT+0200 (Central European Summer Time)'
}

This uses RC.11. Note that the hello cookie locally only becomes available on the second request, I assume that this is how the cookie setting works under the hood (setCookie sets the cookie on the response, then the next request has it attached). In the stackblitz environment the cookie just never becomes available at all.

Assuming that this means that an underlying problem P exists: "coolies don't work in stackblitz" / "h3 cookie utils do not work in stackblitz":

1. I think if it's a goal that nuxt-session works in stackblitz, we have to resolve the underlying problem P in stackblitz first
2. If resolving the underlying problem is a no goal / this is part of a bigger problem: Can we merge this PR anyways, as the problem is not one of nuxt-session and nuxt-session works in local tests (of course this statement may still be challenged!)?

I may be missing something here, but I hope that the reproduction shows that the problem is not actually related to how nuxt-session is implemented.

[danielroe]

Not checked in great detail, but when you are setting a cookie on an event, it sets it on the response. When you are reading cookies on the event, it reads them from the request.

I'm not sure how this was working locally.

[BracketJohn]

But then on the next request, the cookie that was set on the response should also be sent, right? That's what I was trying to say with:

(setCookie sets the cookie on the response, then the next request has it attached)

above

[danielroe]

Sorry, understood!

[BracketJohn]

No worries!

Looking further, even after following stacklitz guidance on browser config to allow all cookies there's nothing (e.g., no Set-Cookie header) coming back in the response on stackblitz:

Locally however, chrome even offers a "cookies" tab:

[danielroe]

It seems stackblitz doesn't currently support setting cookies.

[BracketJohn]

I see, that's a bummer 😢

Do you think we can progress with this PR anyways?

[BracketJohn]

Hey @Atinux, @danielroe - can you guys have another look here? I've added the badges + debugged stackblitz together with you, so I think at the moment nothing else is blocking this.

We'd love to get this module out there + support it in the longterm. We already have ideas like enabling session transmission via a header token instead of a cookie, auto adding endpoints for session management via a config flag, adding conposables to fetch the session client side, ...

I think adding the module to the modules page will be a good step to support this endeavor 🙌

Let me know what remains if you can, otherwise feel free to reach out to me via Twitter / Discord if you want to discuss (: