How safe is job role based authorization in react?

Question

I recently saw a video in which they used react with node/express at the back, to do role based authorization. In that, once a user is authenticated, his job role is passed as a response to the react front end, which is then stored in states and used to render pages accordingly. So, how safe is this approach? Is it possible for someone like a normal user to tamper with the response coming from the server and modify it to something like "admin". Or is there some other approach which is safer. Please help me out as I'm fairly new to these topics.

Answer 1

Is it possible for someone like a normal user to tamper with the response coming from the server and modify it to something like "admin"

Yes they can. React state is just JavaScript, and as a user they can always modify those state value in their browser.

how safe is this approach?

This problem depends on how you secure in the server-side. User can always tamper with the request to server. It's server job to check for whether the request is valid or not. For example using JWT, when the request come to server, the server need to check whether the user is actually admin or not before performing any job.
In general, saving admin role or something similar in front-end usually for the sake of data displaying. You can always do some input checking before sending request to server, but VALIDATE REQUEST in server is a must

Answer 2

Rule Number 1 - Never trust anything from client side.

Whatever information passed on to client side is purely for display purpose.

Every modification on the backend should contains verification of data before it's being inserted/updated into database, or before it's being used for any purpose for an intended user.

A user may change the role to see a different UI, but the UI should never attempt to retrieve information that's not meant for the user, or to accept any input from that user, if the user is not the rightful user.