React PrivateRoute's content is visible to other logged in users - node.js

I've created a React App which has the flow as following:
User Logs In Dashboard is opened
A list of books appear (written by the user)
User clicks on manage books
A new window opens which has information of that book. (Private Route)
Now the question is, the Private Route is only accessible if the user is logged in, and this works fine.
But when I try to copy the URL of the Private Route and open it in a new window, by logging in with a second account, the user sees the content of first user.
So my question is, how to restrict access of content to the specific user only?
Please help! A simple logic will help me.

I don't know for sure your app structure and I will assume that :
user2 tries to reach url /bookstore/bookOfUser1
user2 is not logged in, so he is then redirected to url /login with a mechanism storing the url that the user wants to access
user2 logs in, is redirecte to /bookstore/bookOfUser1 and an api call is made to get the book details with a book id (bookOfUser1)
During the step 3, when fetching the data, your backend should check if the user2 has the access rights to read the book details bookOfUser1. If so, your backend should send the details, if not, it should send an error handled by your frontend. Your frontend would then redirect to a fallback url.

Related

NodeJS App with waiting for the admin to accept

I'm trying to create a Full Stack App with the following requirements:
Have users that post photos
Have an admin that gets those photos and accepts/rejects the photo to be published
So, the user should be able to upload a photo, and, if the admin accepts, the photo should be rendered to the user screen. Otherwise, the user should get some kind of alert saying that the uploaded photo was rejected.
Do you guys know some kind of project where it was done so it can guide me? Or any advice on how to do it?
start with a register/login system first where the users will be given different roles ( admin and user). Then create an admin panel for the admin followed by a profile page for the user. Use a database to send the profile pictures to and display the data in the admin panel, where the admin has got the option to either reject or accept the data. if its accepted display the profile pic otherwise delete the data entry and send a message to the user who has uploaded the profile pic.

How to prevent user change profile id in URL? Vue 3 Nodejs

I have a problem with vue 3 backend and nodejs mongodb. For example i have a user and admin role, admin role can access all menu in dashboard, but user only can edit their profile.
When i login as user and access edit profile menu, for example the url is localhost/profile/121 (121 is my user id), i will get my user data by id. But, user can edit the url id with another id, for example localhost/profile/122, and its not good.
How to prevent that user can only view or update their profile only? When at login page, i store the accesstoken, refreshtoken, id, and role in localStorage. And i see that localStorage can edited.
What is the best way for login in vue 3, nodejs with role model? And is that any way for prevent that user can only edit their data?
Thanks before.
Make sure that you have the id in the access token or the session.
Now every time a url is entered, see if the id is the same of the user, if yes, proceed. But, in case, it does not belong to the user, you can either redirect the user to the valid page or show unauthorized message.

Auto login user after email verification (Express/passport)

I would like to make it so after the user clicks their email verification link they are automatically logged in.
How can I go about this?
Edit: It was as simple as
req.session.passport.user = newUser._id
Apparently all passport does is assign the user ID to a user session, so doing it manually did the trick. Then just redirect the user accordingly.
Look into deep-linking.
You need to redirect the user when they click activate (uri to app or url to a website). This can be done with Express's redirect function.
For apps, there is a scheme tied to the app (ex. myapp://) which opens the app if you have it installed. In that case, whatever payload you sent (authentication information) can be listened for and handled to log the user in automatically.
For websites, you need to redirect them to a url along with their authentication information. You'll be listening for that as well, and log the user in automatically on your website.

What is the id parameter passed in the uri with identity server

I am using oidc-token-manager with OAuth and identity server to setup authorization/authentication on my site. All the functionality is working fine . I am just wondering what the id parameter is that is being sent to identity server
https://foobar.net/identity/ui/login?id=216257a45dbd3041eee88fa8aa5d3b0cidc
and more specifically can i use that, in some form, to add a button on identity server to send the user back to the page that they came from. To be clear the post login redirect is working fine . once the user logs in with his/her credentials it automatically sends them back to the website. However there are 2 senarios that i want to take into account to extend the redirection.
case 1 : If the user clicks login from the website and then is like "nah dont really want to log in anymore have to afk and deal with some stuff just get me out of here will come back to it later"
case 2 : The user is not registered yet and clicks the login button from the website instead of the register button . On the login in page there is a "dont have an account? create one now" button. But in its current form it redirects to the registration with no way to set the same flow as the login where there is an automatic redirect back to the website, which will actually be a specific page that tells the user that he has registered and has a time period to check his email to authenticate himself to the site.
This is using an angular app with the set configuration for the OidcTokenManager as
var config ={
authorization_url:'https://foobar.net/identity/connect/authorize',
client_id:'foobar_id',
redirect_uri:'http://localhost:5060/callback.html', // for testing
response_type:'token token_id',
scope:'fooscopes',
authority:'https://foobar.net/identity',
popup_redirect_uri:'http://localhost:5060/login-dialog.html',
silent_renew: true
};
Any help would be awesome . thanks
The id parameter that is passed to the login page is part of how IdentityServer manages the state for pending authorization requests. It's the id of the cookie that holds the SignInMessage that IdentityServer uses internally.
For case 2 if you click one of the additional links the id is passed along. It is then the responsibility of the custom page to get the user back to the login page with that id. I believe we have samples showing this.

How can I authenticate a user from an email link?

Our web app. sends reports out to users which contain links that point to various items within our web app. (specific records). Users ordinarily have to login to our system to access it, so I am wondering what the best methods are of allowing one of these links to direct the user to the area of the system, without them having to repeatedly login.
When you create a link, you can note which user this link is for. When user clicks on the link, fetch information for the user. Guid in your url would guarantee that no other person can guess path for that users data. This will not technically authenticate a user. But will allow them to see data you need.
First of all it's bad idea to distribute user credentials even to a known email address.
You can generate a unique key for each customer and insert it in query string of included URL in the email. once user clicks on the sent URL, system discovers which user is dealing with and authenticates user. After successful authentication process it really makes sense if you disable the sent unique key.

Resources