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

09.03.2021Рубрика: ВопросыАвтор: admin

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

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

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, каждый раз, когда создается новый экземпляр всего веб-сайта. Что я сделал не так и как это исправить?

См. также: Канал async не найден! в Спартаке Ленивая загрузка компонентов CMS

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

Post Views: 125

1 angular javascript oauth-2.0 token

Комментарии: 1

Panossa 09.03.2021 в 00:00
Один из способов справиться с этим, который я использую для некоторых своих образцов, — это визуализировать только главное приложение при запуске в главном окне. В моем небольшом примере я использую 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
Ответить

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