Сохранение запросов с помощью настраиваемой HashLocationStrategy в angular 9

В настоящее время я работаю над приложением Angular на основе 9-й версии RC 6. Я разрабатываю SPA с несколькими микроприложениями, которые интегрированы как веб-компоненты (с использованием Angular Elements). Для маршрутизации я использую HashLocationStrategy, как описано в "Микроприложениях с веб-компонентами с использованием элементов Angular" ( https://www.softwarearchitekt.at/aktuelles/micro-apps-with-web-components-using-angular-elements/ using -angular-elements /) Манфреда Штайера.

Проблема возникает с логином. Я использую OAuth для аутентификации. После перенаправления обратно на мою страницу URL-адрес выглядит какhttp://localhost:4200/?token=...#/callback. Но после того, как путь адаптирован стратегией местоположения, запрос отбрасывается. Я стремлюсь к URL-адресу вродеhttp://localhost:4200/#/callback?token=....

Мое решение состояло в том, чтобы предоставить CustomHashLocationStrategy, который переопределяет существующее создание пути с помощью HashLocationStrategy:

path(includeHash: boolean = false): string {
  // the hash value is always prefixed with a `#`
  // and if it is empty then it will stay empty
  let path = this.platformLocation.hash == null ? '#' : this.platformLocation.hash;
  // any existing query will be appended
  if (this.platformLocation.search != null) {
    path += this.platformLocation.search;
  }

  return path.length > 0 ? path.substring(1) : path;
}

с моим созданием пути:

/**
 * Extension of https://github.com/angular/angular/blob/master/packages/common/src/location/hash_location_strategy.ts
 * The extension was necessary because the default HashLocationStrategy ignores query's.
 */
@Injectable()
export class CustomHashLocationStrategy extends HashLocationStrategy {

  constructor(private platformLocation: PlatformLocation, @Optional() @Inject(APP_BASE_HREF) baseHref?: string) {
    super(platformLocation, baseHref);
  }

  path(includeHash: boolean = false): string {
    // the hash value is always prefixed with a `#`
    // and if it is empty then it will stay empty
    let path = this.platformLocation.hash == null ? '#' : this.platformLocation.hash;
    // any existing query will be appended
    if (this.platformLocation.search != null) {
      path += this.platformLocation.search;
    }

    return path.length > 0 ? path.substring(1) : path;
  }

}

Это хорошо работает с моим проектом. Но я также видел другие решения, такие как HashLocationStrategy и параметры запроса в angular 4. У меня относительно небольшой опыт разработки больших приложений Angular, и я хотел бы спросить, может ли кто-нибудь дать мне подсказку о моем решении и объяснить по сравнению с другим, какое из них лучше.

0 ответов

Другие вопросы по тегам