Okta React загружает слишком много фреймов для каждого запроса - PullRequest
Новая
       8

Okta React загружает слишком много фреймов для каждого запроса

0 голосов
/ 03 сентября 2018

Я пытаюсь настроить Okta-React в своем приложении. Он успешно аутентифицируется с помощью Okta-signin-widget. Однако при каждой загрузке страницы он вызывает как минимум 4 HTTP-запроса к /authorize: enter image description here

Кажется, что он добавляет iframe к DOM для каждого из этих запросов. Вот мой код React для виджета и Okta-React:

Root.js 

<Provider store={store}>
    <Router>
      <Security
        issuer="https://dev-xxxx.oktapreview.com/oauth2/default"
        client_id="xxxx"
        redirect_uri={redirectUri}
        onAuthRequired={customAuthHandler}
      >
        <App />
      </Security>
    </Router>
  </Provider>

App.js 

    import React from 'react';
class App extends React.Component {
  render() {
    return (
      <div className="fill">
        <SecureRoute path="/test" component={Test} />
        <Route
          path="/signin"
          render={({ location, history }) => (
            <Signin location={location} history={history} {...this.props} />
          )}
        />
        <Route path="/implicit/callback" render={() => <ImplicitCallback />} />
      </div>
    );
  }
}

экспорт по умолчанию с помощью роутера (приложения)

Signin.js 

import React from 'react';

import ReactDOM from 'react-dom';
import { Redirect } from 'react-router-dom';
import OktaSignIn from '@okta/okta-signin-widget';
import '@okta/okta-signin-widget/dist/css/okta-sign-in.min.css';
import '@okta/okta-signin-widget/dist/css/okta-theme.css';
import { withAuth } from '@okta/okta-react';

class OktaSignInWidget extends React.Component {
  constructor(props) {
    super(props);

    this.onSuccess = this.onSuccess.bind(this);
  }
  componentDidMount() {
    const el = ReactDOM.findDOMNode(this);

    this.widget = new OktaSignIn({
      baseUrl: this.props.baseUrl,
      authParams: {
        display: 'page',
        responseType: ['id_token', 'token'],
        scopes: ['openid', 'groups', 'profile']
      }
    });
    this.widget.renderEl({ el }, this.onSuccess, this.props.onError);
  }

  onSuccess(res) {
    this.props.onSuccess(res);
    this.widget.remove();
  }

  render() {
    return <div />;
  }
}

export default withAuth(
  class Signin extends React.Component {
    constructor(props) {
      super(props);
      this.state = {
        authenticated: null
      };

      this.onSuccess = this.onSuccess.bind(this);
      this.onError = this.onError.bind(this);
      this.checkAuthentication = this.checkAuthentication.bind(this);
      this.checkAuthentication();
    }

    componentDidUpdate() {
      this.checkAuthentication();
    }

    async checkAuthentication() {
      const authenticated = await this.props.auth.isAuthenticated();

      if (authenticated !== this.state.authenticated) {
        this.setState({ authenticated });
      }
    }

    onSuccess = res => {
      this.props.auth.redirect({
        sessionToken: res.sessionToken || res.session.token
      });
    };

    onError = error => {
      console.log('Something went wrong', error);
    };

    render() {
      if (this.state.authenticated === null) return null;

      if (this.state.authenticated) {
        return <Redirect to={{ pathname: '/test' }} />;
      }

      return (
        <OktaSignInWidget
          baseUrl="https://dev-xxxx.oktapreview.com"
          onSuccess={this.onSuccess}
          onError={this.onError}
        />
      );
    }
  }
);

Я использую: 

"@okta/okta-auth-js": "^2.0.0",
"@okta/okta-react": "^1.0.3",
"@okta/okta-signin-widget": "^2.10.0",
"react-router-dom": "^4.3.1",
"react": "^16.4.2",

Кто-нибудь видел что-то подобное раньше, когда интегрировал ваше приложение с Okta-React? Это ожидаемое поведение? Я предполагал, что Okta нужно будет выполнить только один из этих запросов?

1 Ответ

0 голосов
/ 05 сентября 2018

В @okta/okta-auth-js@2.0.0 была ошибка, которая вызывала много обновлений токенов, если вы обновите эту зависимость до 2.0.1, это должно решить проблему.

...