Comments (5)
Yes this is possible. It depends on how you check if the JWT is present, but you can certainly do a redirect in a route pre-condition. Just use replace()
!
from svelte-spa-router.
@ItalyPaleAle, how to do it without copy-pasting a lot? Currently, all routes have to be wrapped, and the condition have to be specified. If the app only provides logged-in functionality, then it has to be defined for every single route. That's a lot of copy-pasting. It would make more sense to specify conditions for the router, that are applied to every route.
from svelte-spa-router.
@notramo in this case, where the entire app requires auth, I would put the auth check outside of the Svelte code, in the “main” JS function, before you instantiate the Svelte App.
I’ve done this before many times. One example is here: https://github.com/ItalyPaleAle/calendar-next-demo/blob/master/src/main.js Note this code is VERY OLD so please don’t copy-paste what I did there :) But you can get the gist!
from svelte-spa-router.
@ItalyPaleAle I'm currently doing this in App.svelte
, with onMount()
. The problem is that it only works on initial page load, but if the user changes the hash to a valid route after the app is loaded, it is displayed (and a load of errors are thrown, since the token is missing).
from svelte-spa-router.
If the token is missing, that’s a separate problem. You will want to persist the token somewhere, for example in localStorage.
If the problem is that the token could expire in the meanwhile, yes that’s something that needs to be handled on each request.
The common pattern here is to bake the auth check into the fetch
handler you use. If the server responds with 401, then you redirect the user to the auth page. This is not done in the router, but in the code that invokes the remote server.
The reason for doing this is that generally apps do not make requests only when a new page is loaded. I don’t know your app, but it’s common for a page to make requests even without trigger a navigation. In this case, handling the check in the code that performs network requests is the way to make sure you’re not missing any situation.
from svelte-spa-router.
Related Issues (20)
- In vite, i can't use the proxy /dev HOT 1
- Nested routes as maps HOT 1
- If I want to go to the login page in the sidebar + SPA form, is it possible with route guard? HOT 4
- Is this not possible in routeLoaded? HOT 5
- What is the black bar in this image? HOT 2
- Feature request: Svelte 4 support HOT 13
- FEATURE REQUEST: pass next() in precondition to decide whether the router should *change* the current route HOT 1
- Load user data HOT 4
- How to check hash-bashed history HOT 1
- Is there an alternative to the "Failed to fetch dynamically import problem" issue in Vite + Svelte spa environment? HOT 1
- WARNING: The following packages have a svelte field in their package.json but no exports condition for svelte. [email protected] HOT 8
- Typescript problematic types after "wrapping" the route HOT 2
- navigating within same component does not work HOT 5
- Typescript support: Package path ./wrap is not exported from package svelte-spa-router HOT 2
- Will the library support Svelte 5? HOT 5
- Authentication and Authorization HOT 6
- Layouts not exists for svelte-spa-router? HOT 6
- Feature request: Nested route priority HOT 1
- children router bug HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from svelte-spa-router.