React Integration Example Logout Issue

reactjs

#1

Hello,

Did anybody manage to follow the example react integration steps that is in the developer portal?

I had it partially working, after correcting a typo in example and setting up CORS for localhost, but logout action is failing.

In code, auth.logout makes request DELETE https://{org-url}/api/v1/sessions/me and that returns 404.

Not sure if I need to do any other settings in admin portal or not.

Thanks in advance!

UPDATE:
According to Okta documentation for Sessions

If the session was successfully closed, a 204 No Content response will be returned.

If the session is invalid, a 404 Not Found response will be returned.

Not sure why I am getting 404…


#2

Same error with same example.


#3

@mraible can you help here?


#4

Sorry for the delay here. Are you using the React + SignIn Widget or the React Auth SDK integration?


#5

I was using withAuth component (so is it called SDK?).


#6

Hey Anatoly:

Yes. The withAuth component is part of the @okta/okta-react SDK. I will build run through the quick start this weekend and see if I can replicate the issue. If not, I’ll send you a github repo so you can compare what you have.

Regards,
Lee


#7

I followed the example at: https://developer.okta.com/code/react/okta_react.html and haven’t been able to reproduce a logout error.

The only thing I can think of is either the docs were recently updated (possible) or it possible that your CORS endpoint may not be set up correctly. Attached is a screenshot of the one I have set up.

Hope this helps. Please let me know if following the docs (in case they’re updated) results in the same error.

Thanks,
Lee Brandt


#8

the point is that in following tutorial httpsut://developer.okta.com/quickstart/#/react/nodejs/express mentioned only Login redirect URIs but not Logout


#9

Totally understand 100%, right now the quickstarts are truly quickstarts. Getting you set up for authentication and then dropping the mic. There is some work for Okta to do to merchandise next steps. Look for some changes soon.

Are you still having the error?


#10

I’m getting the other thing. When pressing logout button i’m getting the following response:

!Request URL:https://dev-xxxxx.oktapreview.com/api/v1/sessions/me
Request Method:DELETE
Status Code:204 No Content

but it doesn’t redirects while i have:

and the following code:

function onAuthRequired({history}) {
     history.push('/login');
}

class App extends Component {

  render() {

    return (
      <Router>
        <Security issuer={config.issuer}
                  client_id={config.clientId}
                  redirect_uri={config.redirectUri}
                  onAuthRequired={onAuthRequired}
                  >
          <Route path='/' exact={true} component={Home}/>
          <Route path='/login' exact={true} component={Home}/>
          <Route path='/implicit/callback' component={ImplicitCallback} />
        </Security>
      </Router>
    );
  }
}

#11

So the problem was in absence of the following lines:

componentDidUpdate() {
this.checkAuthentication();
}

which are presented in https://developer.okta.com/code/react/okta_react.html but not in
https://developer.okta.com/quickstart/#/react/nodejs/express


#12

Thanks for reporting this! I’ve entered an issue for it. https://github.com/okta/okta.github.io/issues/1961