Redirect new users after sign up to Secured Routes in ReactJs application using AuthO

[codenameredpanda]

Hi,

I have just started using AuthO for my Reactjs application for authentication purposes. I am using the AuthO authentication API for this purpose. Specifically WebAuth from 'auth0-js'

I am using social provider (Google) and also AuthO database based user login mechanism.
When using google-based login mechanism, I am successfully able to authenticate the users and redirect them back to my application using the callback url specified in the dashboard.
I am also able to signup new users using the AuthO signup login page. (I can see the new users being created in the dashboard).

I have setup secured routes in my application using react router V4 which means only authenticated users can access those routes.(I have set it up as per this blog : The Complete Guide to React User Authentication with Auth0) . After successful authentication using google-based login, I parse the url hash and extract the returned tokens using Auth0 api’s parseHash method in my CallBack component and setup my app authentication state.
I use this state throughout my app to determine whether user is allowed to access a particular route or not.

The thing that I am facing an issue is this: I am unable to redirect a new user to the secured route post signup.
Initially, I wasn’t able able to redirect the new user to my application post signup. However, after setting up a rule as below I was able to redirect the new user to the application after signup:

function (user, context, callback) {
  // TODO: implement your rule
  // // if it is the first login (hence the `signup`)
  if (context.stats.loginsCount === 1) {
    context.redirect = {
            url: "http://localhost:3000/home"
        };
  }
  callback(null, user, context);
}

However, I am still struggling to find a way on how to redirect to a secured route. home is my secured route where it checks if the user is authenticated. I am unaware on how to get the authentication information after being redirected by the rule. I tried to use the parseHash method just like I had used in the callback after authentication with google but with no luck.

Any pointers or directions on how I can achieve this would be really helpful.

Thanks

[James.Morrison]

Hey there @codenameredpanda, are you seeing any errors when you go to redirect to a secure route? Thanks.

Adding for historical reference:

React Router 4: A Practical Introduction

GitHub - auth0-samples/auth0-react-samples: Auth0 Integration Samples for...

[codenameredpanda]

Sorry for the delay in response James. I was able to resolve this issue.

I think the problem was caused by the rule. I was adding a redirect in the rule but was not calling continue within my code. Hence the transaction wasn’t getting complete. Hence authO wasn’t able to call my callback component.

Once, I got rid of the rule, it started working as expected.

Thanks

[James.Morrison]

I’m glad to hear you got it all handled @codenameredpanda, have a happy holidays!