Как выполнить тихое обновление через неявный поток в Angular?

поэтому у меня проблема с тем, что наш токен не обновляется. Более того, весь наш сайт дублируется. Вот предыстория:

У нас есть следующая конфигурация авторизации (более-менее):

export const authConfig: AuthConfig = {
    issuer: '[censored]',
    redirectUri: window.location.origin + '/',
    silentRefreshRedirectUri: window.location.origin + '/assets/login-sources/silent-refresh.html',
    tokenEndpoint: '[censored]',
    loginUrl: '[same as tokenEndpoint]',
    clientId: '[censored]',
    scope: '[censored]',
    clearHashAfterLogin: true,
    oidc: true,
};

А еще у нас есть loginService, который onInit выполняет примерно следующее:

this.oauthService.configure(authConfig);
this.oauthService.tokenValidationHandler = new JwksValidationHandler();
// this.oauthService.setupAutomaticSilentRefresh(); - didn't work
this.oauthService.loadDiscoveryDocument([censored]).then((doc) => {
  // Subscribe to expiration event to refresh token.
  this.oauthService.events
    .pipe(filter(element => element.type === 'token_expires'))
    .subscribe(
      (a) => {
        console.log("Token is about to expire! Refreshing!");
        this.oauthService.silentRefresh().then(result => console.log(result)).catch(error => console.error(error));
      }
    );
  if (this.userid == null) {
    this.oauthService.tryLoginImplicitFlow().then((loggedIn) => {
      if (!loggedIn) {
        this.oauthService.initLoginFlow();
      }
    });
  }
});

Проблема: всякий раз, когда срок действия токена истекает, происходят следующие вещи:

  • Весь веб-сайт клонирует свой экземпляр, поэтому два экземпляра работают параллельно (согласно консоли) = ›это еще хуже, если мы используем automaticSilentRefresh без всех этих прослушивателей событий. Там он клонирует себя на неопределенный срок, пока не закончит ОЗУ.
  • Через несколько секунд мы получаем ошибку тайм-аута обновления в консоли без трассировки стека.

Итак, я изучил код silentRefresh () и, похоже, он работает с iframe. В указанном iframe ДОЛЖЕН быть простой код, который используется для обновления токена и связи с основным приложением см. здесь. Мы даже реализовали refresh.html как здесь. Однако в нашем случае у нас есть iframe, в котором зеркалируется весь веб-сайт. Значит, у нас есть что-то вроде этого:

html
  head /head
  body
    app-root /app-root
    iframe
      app-root /app-root
    /iframe
  /body
/html

Поскольку для каждого silentRefresh () iframe удаляется и повторно добавляется в DOM, каждый раз, когда создается новый экземпляр всего веб-сайта. Что я сделал не так и как это исправить?

См. также:  stable / airflow подключить внешнюю базу данных PostgreSQL

Версии: Angular 9 + angular-oauth2-oidc: ^ 9.0.1, angular-oauth2-oidc-jwks: ^ 9.0.0.

Понравилась статья? Поделиться с друзьями:
IT Шеф
Комментарии: 1
  1. Panossa

    Один из способов справиться с этим, который я использую для некоторых своих образцов, — это визуализировать только главное приложение при запуске в главном окне. В моем небольшом примере я использую index.html как для основного приложения, так и для iframe обновления, но меняю выполняемый код.

    Мой — образец ReactJS И это техника, которую я использовал. Надеюсь, это поможет не слишком навязчиво, хотя могут быть альтернативные решения.

    if (window.top === window.self) {
    
        // Run the main ReactJS app
        render (
            <App />,
            document.getElementById('root'),
        );
    } else {
    
        // Run a minimal app to handle the iframe renewal
        const app = new IFrameApp();
        app.execute();
    }
    
    

    К сожалению, ваш подход не подходит для этого плагина Angular. Мне кажется, что неявный поток просто нарушен. Мы только что перешли на поток кода, и теперь он работает отлично. ^^ person Panossa; 12.03.2021

    Круто — в наши дни вы должны использовать поток кода авторизации (PKCE), поскольку неявный поток не рекомендуется для SPA — рад, что вы решили свою проблему. person Panossa; 12.03.2021

Добавить комментарий

;-) :| :x :twisted: :smile: :shock: :sad: :roll: :razz: :oops: :o :mrgreen: :lol: :idea: :grin: :evil: :cry: :cool: :arrow: :???: :?: :!: