Recommended approach for Auth Guard for svelte-kit apps

[jerrythomas]

What is the recommended approach for implementing a role-based guard for svelte-kit based applications?

Until v1.0.0-next.232 handle function in hooks seemed to be called every time route changed and adding a check and redirect before accessing any protected route was easy.

Adding a load function in the __layout.svelte does not work, because it is called only once.
Adding a load function on every page for route guard is cumbersome, is there a better/recommended way?

[thenbe]

You can implement an auth guard with a single load function by making it reactive. Take a look at this paragraph from the docs.

If you want a visual example, here's a youtube video showing the process.

[jerrythomas]

Thanks. I tested this out and the reactive load function does work as you have mentioned.
However, the route guard needs to be added to every __layout.reset.svelte also if the app has any.

[DonTomato]

It seems your link can't be opened anymore.

[eltigerchino]

Just wanted to chime in and recommend implementing auth guards in src/hooks.server.js. Lucia has an example of how the server hook can be used to handle authentication. Additionally, you can add logic to match only certain routes based on the URL or handle authorisation based on the session data.

It is not recommended to handle auth in layout functions since those do not run for +server endpoints.

[BillBuilt]

I was having the same problem understanding how to effectively protect all routes under a specific path, until I re-read this part of the docs from the link provided above: Specifically, if url, session or stuff are used in the function, they will be re-run whenever their value changes, and likewise for the individual properties of params. **Note that destructuring parameters in the function declaration is enough to count as using them.** and realized that all I needed to do to get the __layout load() function to get called on each request was to destructureurl in the function even if I was not using it.

[rkanik]

Check this out sveltekit-route-guard

[mehdikhody]

I've written a lightweight library for myself to handle protected route guards with ease.
You are also welcome to use it.
svelte-guard

[kidvon]

hello, it can be used for spa？

[mehdikhody]

yes

[jerrythomas]

I have implemented something that works well with supabase auth. Planning to extend it to support others like firebase, auth0, etc.
https://github.com/jerrythomas/kavach