I am developing a unique angular application that utilizes a directive named ng-auth to manage the visibility of elements based on the user's login status. Here is an example:
<div ng-auth="!isAuthenticated()">
<a href="/login">Log-in</a> //This will be displayed if the user is not logged in
</div>
<div ng-auth="isAuthenticated()">
<p>Welcome {{ user }}</p> //This will be displayed if the user is logged in
</div>
It is important for me to consider that users may have control over the client and can access all supposed "protected" elements that I intend to hide from them. I understand the necessity of separating concerns by validating sensitive requests with the server. However, this raises a couple of questions for me:
- How can I present sensitive information within the view? If I wanted to show
{{ user.sensitiveInformation }}instead of justWelcome {{ user }}, how should I approach this situation? - What is the proper way to authenticate the user with the server? As far as I know, I should send the cookie containing the session id to the server for validation. But, how can I prevent a user from sending someone else's cookie or manipulating the response from the server to deceive the client into revealing certain information?