reactjs - 反応アプリでoidcクライアントを使用して認証後にリダイレクトする方法

Question

反応アプリにアイデンティティサーバー4を使用して認証を試みています。このドキュメントに従いました。アイデンティティサーバーの暗黙的なフローを使用しているため、アプリケーションをオンロードすると、アイデンティティサーバーのログインページに移動します。適切なユーザー名とパスワードを入力すると、検証されてトークンが発行されます。すべてが期待どおりに機能していますが、反応アプリをダッシュ​​ボード ページにリダイレクトできません。反応するのは初めてです。助けてください。

  // Copyright (c) Microsoft. All rights reserved.

import Config from 'app.config';
import AuthenticationContext from 'adal-angular/dist/adal.min.js'
import { Observable } from 'rxjs';
import { HttpClient } from 'utilities/httpClient';
import { toUserModel, authDisabledUser } from './models';
import Oidc, { User } from 'oidc-client';

const ENDPOINT = Config.serviceUrls.auth;

export class AuthService {

  //static authContext; // Created on AuthService.initialize()
  //static authEnabled = true;
  //static aadInstance = '';
  //static appId = '00000000-0000-0000-0000-000000000000';
  //static tenantId = '00000000-0000-0000-0000-000000000000';
  //static clientId = '00000000-0000-0000-0000-000000000000';

  static initialize() {
    if (typeof global.DeploymentConfig === 'undefined') {
      alert('The dashboard configuration is missing.\n\nVerify the content of webui-config.js.');
      throw new Error('The global configuration is missing. Verify the content of webui-config.js.');
    }

    if (typeof global.DeploymentConfig.authEnabled !== 'undefined') {
      AuthService.authEnabled = global.DeploymentConfig.authEnabled;
      if (!AuthService.authEnabled) {
        console.warn('Auth is disabled! (see webui-config.js)');
      }
    }

    //AuthService.tenantId = global.DeploymentConfig.aad.tenant;
    //AuthService.clientId = global.DeploymentConfig.aad.appId;
    //AuthService.appId = global.DeploymentConfig.aad.appId;
    //AuthService.aadInstance = global.DeploymentConfig.aad.instance;

    if (AuthService.aadInstance && AuthService.aadInstance.endsWith('{0}')) {
      AuthService.aadInstance = AuthService.aadInstance.substr(0, AuthService.aadInstance.length - 3);
    }

    // TODO: support multiple types/providers
    if (AuthService.isEnabled() && global.DeploymentConfig.authType !== 'aad') {
      throw new Error(`Unknown auth type: ${global.DeploymentConfig.authType}`);
    }

    //AuthService.authContext = new AuthenticationContext({
     // instance: AuthService.aadInstance,
      //tenant: AuthService.tenantId,
      //clientId: AuthService.clientId,
      //redirectUri: "http://localhost:3000/dashboard",
      //expireOffsetSeconds: 300, // default is 120
      //postLogoutRedirectUri: window.location.protocol
    //});
  }

  static isDisabled() {
    return AuthService.authEnabled === false;
  }

  static isEnabled() {
    return !AuthService.isDisabled();
  }

  static onLoad(successCallback) {
    debugger;
    AuthService.initialize();
    if (AuthService.isDisabled()) {
      console.debug('Skipping Auth onLoad because Auth is disabled');
      if (successCallback) successCallback();
      return;
    };
    var config = {
      authority: "http://localhost:5000",
      client_id: "mvc",
      redirect_uri: "http://localhost:3000/dashboard",
      response_type: "id_token token",

      post_logout_redirect_uri : "http://localhost:5003/index.html",
  };
  var mgr = new Oidc.UserManager(config);
  mgr.signinRedirect();


  mgr.getUser().then(function(user){
    if(user){
      console.log("User logged in", user.profile);
    }
    else {
      console.log("User not logged in");
  }
  }); 
  mgr.events.addUserLoaded(function(userLoaded){
    mgr.User=userLoaded;
  })
  mgr.events.addSilentRenewError(function (error){
    console.log('the user has signrd out');
    mgr._user=null;
  })


  //mgr.login();

  //mgr.renewToken();


    // Note: "window.location.hash" is the anchor part attached by
    //       the Identity Provider when redirecting the user after
    //       a successful authentication.
    // if (AuthService.authContext.isCallback(window.location.hash)) {
    //   console.debug('Handling Auth Window callback');
    //   // Handle redirect after authentication
    //   AuthService.authContext.handleWindowCallback();
    //   const error = AuthService.authContext.getLoginError();
    //   if (error) {
    //     throw new Error(`Authentication Error: ${error}`);
    //   }
    // } else {
    //   AuthService.getUserName(user => {
    //     if (user) {
    //       console.log(`Signed in as ${user.Name} with ${user.Email}`);
    //       if (successCallback) successCallback();
    //     } else {
    //       console.log('The user is not signed in');
    //       AuthService.authContext.login();
    //     }
    //   });
    // }
  }

  static getUserName(callback) {
    if (AuthService.isDisabled()) return;

    if (AuthService.authContext.getCachedUser()) {
      Observable.of({ Name:AuthService.authContext._user.userName, Email: AuthService.authContext._user.userName })
        .map(data => data ? { Name: data.Name, Email: data.Email } : null)
        .subscribe(callback);
    } else {
      console.log('The user is not signed in');
      AuthService.authContext.login();
    }
  }

  /** Returns a the current user */
  static getCurrentUser() {
    if (AuthService.isDisabled()) {
      return Observable.of(authDisabledUser);
    }
    return HttpClient.get(`${ENDPOINT}users/current`)
      .map(toUserModel);
  }

  static logout() {
    if (AuthService.isDisabled()) return;

    AuthService.authContext.logOut();
    AuthService.authContext.clearCache();
  }

  /**
   * Acquires token from the cache if it is not expired.
   * Otherwise sends request to AAD to obtain a new token.
   */
  static getAccessToken() {
    debugger;
    if (AuthService.isDisabled()) {
      return Observable.of('client-auth-disabled');
    }

    return Observable.create(observer => {
      return AuthService.authContext.acquireToken(
        AuthService.appId,
        (error, accessToken) => {
          if (error) {
            console.log(`Authentication Error: ${error}`);
            observer.error(error);
          }
          else observer.next(accessToken);
          observer.complete();
        }
      );
    });
  }
}

私が直面している問題は、認証後にアプリが何らかのループに陥っていることです。これは、アプリの URL が ID サーバーとローカル アプリの URL に変更されていることを意味します。以前、私のアプリが adal から AuthenticationContext を使用していたことがわかります。 ID サーバー 4.