Невозможно запустить пример приложения React-OIDC от OKTA, клонированный из репозитория Github от OKta. - PullRequest
Новая
       69

Невозможно запустить пример приложения React-OIDC от OKTA, клонированный из репозитория Github от OKta.

0 голосов
/ 16 апреля 2019

Невозможно получить страницу входа (имя пользователя и пароль) в образце приложения Okta, описанном в блоге с хранилищем кода в , нажмите

Следил за блогом OKtaо создании OIDC CLient и использовании его в приложении React.https://developer.okta.com/blog/2017/03/30/react-okta-sign-in-widget

Клонировал репозиторий Git https://github.com/okta/samples-js-react/tree/master/okta-hosted-login

Создал учетную запись dev на Okta, создал клиента OIDC и получил URL-адрес авторизации, идентификатор CLinet, секрет клиента и т. Д.

npm установил приложение реагирования.

Запустите браузер на http://localhost:3000 Приложение запускается и отображает страницу, но не отображается виджет входа или страница

Использование Windows 10, node.js (10.15.3), npm 6.4.1, браузер Chrome

Я удалил node_modules и package-lock.json и снова запустил установку npm, как рекомендовано, но это не помогло. 

import React from 'react';
import OktaSignIn from '@okta/okta-signin-widget';

export default class LoginPage extends React.Component
{
    constructor()
    {
        super();
        this.widget = new OktaSignIn(
        {
            baseUrl: 'https://dev-315128.oktapreview.com',
            clientId: '0oah3nicwuWOMY4ie356',
            redirectUri: 'http://localhost:3000',
            authParams: {
            responseType: 'id_token'
        }
    }
    );
  }

  componentDidMount()
  {
    this.widget.session.get((response) => {
      if(response.status !== 'INACTIVE'){
        this.setState({user:response.login});
      }else{
        this.showLogin();
      }
    });
  }

   showLogin(){
    Backbone.history.stop();
    this.widget.renderEl({el:this.loginContainer},
      (response) => {
        this.setState({user: response.claims.email});
      },
      (err) => {
        console.log(err);
      }
    );
  }

  logout(){
    this.widget.signOut(() => {
      this.setState({user: null});
      this.showLogin();
    });
  }

  render(){
    return(
      <div>
        {this.state.user ? (
          <div className="container">
            <div>Welcome, {this.state.user}!</div>
            <button onClick={this.logout}>Logout</button>
          </div>
        ) : null}
        {this.state.user ? null : (
          <div ref={(div) => {this.loginContainer = div; }} />
        )}
      </div>
    );
  }
}

Браузер должен отобразить страницу входа, но я получаю только страницу Valilla без параметров входа в Okta

...