I know this has been discussed several times but I am still lacking the information, how easily someone can mess with your authentication logic on the client side.
So this is my understanding of how the authentication works roughly when using client side rendering:
ask user to provide login credentials
make an http call sending the credentials to some api server
api server checks database for match
if no record has been found api server returns isAuthenticated = false to client
and here the fun begins.
To be more precise let's look at the code below:
const isAuthenticated = false
router.beforeEach(async (to, from) => {
if (
// make sure the user is authenticated
!isAuthenticated &&
// ❗️ Avoid an infinite redirect
to.name !== 'Login'
) {
// redirect the user to the login page
return { name: 'Login' }
}
})
Now, can a bad guy just set the isAuthenticated flag to true and skip the login process? I do understand that there won't be any data available,just an empty template but I am curious if isAuthenticated is defined as a const variable is it still possible to change its value in devTools and mess around?
What are good practices here in general? Is CSR any good for web projects including login pages?
