Can't access a react protected route using URL

Get Help
,
3

Hi @sprwalrus,

Welcome to the Auth0 Community!

The app is redirecting to the home page after login because of window.location.origin being set as the redirect_uri in authorizationParams. You can try setting the redirect_uri to the /users route. Alternatively, you can try the below adjustment to the AuthenticationGuard code.

The withAuthenticationRequired takes the component you want to protect and a configuration object to customize the auth flow. You are already using the onRedirecting property. There’s another property you can use here: returnTo. This property lets you specify a path for React to redirect a user after the login transaction that the user triggered in this component completes.

Example:

const AuthenticationGuard = ({component}) => {
    const AuthenticatedComponent = withAuthenticationRequired(component, {
        onRedirecting: () => <PageLoader/>,
        returnTo: '/users'
    });
    return <AuthenticatedComponent/>;
};

export default AuthenticationGuard;

Here is a helpful guide to all things React: React Router 6 Code Sample: Basic Authentication

Info on Route Guards in React: React Authentication By Example: Using React Router 6

I hope this helps!

Best,

Mary Beth