как успешно войти в приложение с помощью входа, инициированного okta idp

#reactjs #identity #okta

Вопрос:

Я создал приложение react и использую образец okta, приведенный ниже, для входа в систему с помощью okta.

https://developer.okta.com/code/react/okta_react/#add-an-openid-connect-client-in-okta

Я могу успешно войти в приложение из своего приложения, четко введя учетные данные и нажав на кнопку входа.

но если я войду в учетную запись okta dev, а затем перейду в свое приложение, мое приложение не распознает существующий сеанс.

ниже приведен мой компонент входа в систему,

  import React, { useEffect } from 'react';
 import { Redirect } from 'react-router-dom';
 import { useSelector, useDispatch } from "react-redux";
 
 import OktaSignInWidget from '../../Shared/oktaSignInWidget/OktaSignInWidget';
 import { useOktaAuth } from '@okta/okta-react';
 import * as sharedActions from '../../Shared/data/actions';
 
 const Login = ({ config }) => {
     const { oktaAuth, authState } = useOktaAuth();
     const dispatch = useDispatch();
 
     useEffect(() => {
         dispatch(sharedActions.setCurrentComponent('login'));
         // console.log('authState.isPending :', authState.isPending);
         // console.log('authState.isAuthenticated :', authState.isAuthenticated);
     }, []);
 
     useEffect(() => {
 
         if (!authState.isPending) {
             console.log(' authState.isPending :', authState.isPending);
             console.log(' authState.isAuthenticated :', authState.isAuthenticated);
         }
 
     }, [authState]);
 
     const onSuccess = (tokens) => {
         console.log('tokens :', tokens);
         oktaAuth.handleLoginRedirect(tokens);
     };
 
     const onError = (err) => {
         console.log('error logging in', err);
     };
 
     if (authState.isPending) return null;
 
     return authState.isAuthenticated ?
         <Redirect to={{ pathname: '/' }} /> :
         <OktaSignInWidget
             config={config}
             onSuccess={onSuccess}
             onError={onError} />;
 };
 export default Login;
 

Ответ №1:

  useEffect(() => {

    // check to see if the user already has an okta session

    oktaAuth.session.exists().then((response) => {
        console.log(' response : ', response);

        setCheckingSession(false);

        if (response) {

            // oktaAuth.token.getWithRedirect();

            oktaAuth.token.getWithoutPrompt().then((response) => {
                console.log('response tokens : ', response);
                oktaAuth.tokenManager.setTokens(response.tokens);
            });

        }
    });

}, [oktaAuth.session, oktaAuth.token]);