JWT Authorization in Angular 5

Question

I'm trying to implement JWT authentication and authorization, however I'm worried about JWT tampering in the front-end part. I got the backend working smooth and safe now. Now I'm implementing JWT authorization and authentication in Angular 5. I'm a beginner at implementing JWT tokens so bear with me and hopefully you people can shed some light on this.

I know that whenever you tamper the token, the JWT gets invalidated because of the signature. The backend will then refuse to process the request, however suppose the following scenario in the frontend:

1 - Evil user logs in with a normal account and receives a JWT token from the backend.

2 - Evil user tampers with JWT token by adding an extra "admin" role to the payload (this invalidates the jwt)

3 - Evil User tries to access a protected route holding the tampered JWT token

4 - Route guard checks whether token is expired (by checking the expiry claim in the payload?)

5 - User decides to tamper the JWT again to increase the JWT expiry claim (The JWT token is still invalid according to the backend)

6 - Route decodes the JWT and sees that the JWT is not expired and that the user has the admin role and gives access to the page the evil user and sees the rendered HTML (Backend operations are safe because the token gets validated first)

Am I missing something? How can I prevent this from happening? I want to prevent the user from accessing the page even if it would be half-working.

Answer 1

I think you got it right.

To avoid this kind of issue, what you could do is make a request when the user first enters the admin module, to check if the token is valid. If not, you disconnect or redirect.

Secodn option would be to let it flow, and implement an HTTP interceptor. The user will be able to see the HTML of the back office, but he will have to make a request eventually. In this case, you make your interceptor redirect on 403 errors, meaning your user will never have access to your backend data.

Finally, what you could also do it store the initial value of your token at your application startup, and check if the value has changed when the user comes on the admin module.

If the value has changed, then the user played with his token, and you can just redirect him.