Question
Let's imagine a client opens your nuxt.js website on the
index page. From there, they authenticate (you used @nuxtjs/auth-
next for that purpose). Then they move to a secure
page that only authenticated users can see. This secure page is a .vue file in
your "pages" folder with middleware: ["auth"].
Now, how is this page really secure ?
Answer
Your application being an SPA at the end, if you want to bypass a middleware with it's security checkup, you could disable the JS on the page. But then, since no content is generated directly, you won't see anything because it's not here (as a static file).
If your app is isomorphic (basically has a ssr: true), the auth module will
still disable the access to those pages (you can double check).
At the end, the critical info is received when:
- you do have a valid JWT token (after some login)
- you submit an HTTP query to the backend
- the backend acknowledges it and the token is valid
- the backend gives you the sensitive info via an HTTP response
At the end, your client side code doesn't need to be secure. If somebody
somehow hacks your client side state and reaches the sensitive page, he will
still not have a valid JWT token since the verification still happens on the
backend.
The one that can be generated only when sending the proper credentials to the
backend and having the backend validating those.
