MSAL перенаправляет с хешем в URL

Question

В настоящее время я работаю над приложением в angular 6, которое использует AAD для аутентификации пользователей.Здесь я использовал библиотеку azure / msal-angular для подключения к AAD v2.Я инициализировал библиотеку с моим клиентским идентификатором, как предписано в файле readme для проекта, и я могу войти в систему очень хорошо.

Проблема заключается в следующем: после входа в систему я установил URL перенаправления на: http://localhost:4200/account целевая страница после входа в систему, куда я хочу, чтобы пользователь пришел после успешного входа.Здесь я указал маршрут так:

{ path: 'account', component: AccountDetailedComponent }

Это нормально, за исключением того, что URL-адрес перенаправления из AAD переходит на http://localhost:4200/account#id_token=xxxxx, и я не могу избавиться от hashbang и id_token..

Я ожидал бы, что id_token = xxxx будет параметром запроса примерно так:

http://localhost:4200/account?id_token=xxxx

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

Мой вопрос: как я могу решить маршрут, соответствующий указанному маршруту?

Я читал о сопоставителях на маршрутах, номожет ли быть так, что я должен сделать регулярное выражение для соответствия обычному маршруту перенаправления?Я не вижу ни опции в интерфейсе, чтобы удалить этот hashbang, ни в библиотеке.

Редактировать

Причина, по которой это не соответствует маршрутубыл, я был перенаправлен на страницу входа снова, после первоначального перенаправления в / account.Он будет мигать / account # id_token = xxxx, а затем перенаправить на страницу входа снова.Мой ответ ниже описывает решенную проблему.

Надеюсь, вы поможете.

С уважением, Крис

Answer 1

Итак, я действительно решил свой вопрос.Ошибка, которую я сделал, это вызвать msalService.loginredirect() вручную из ngOnInit ().Когда происходило перенаправление на страницу Microsoft, я входил в систему, а затем возвращался в свое приложение.Это вызвало бы тот же msalService.loginRedirect() из метода ngOnInit и, таким образом, никогда не дойдет до фактического перенаправления.

Из того, что я смог понять, правильный способ обработки входа в систему заключается в простом примененииcanActivate: [MsalGuard] на конкретном маршруте, и пусть охранник обрабатывает перенаправление на экран входа в систему, и когда вы вернетесь, он перенаправит на указанный путь без хэша.

Надеюсь, это поможет другимчто пытался делать то, что я сделал.Я могу подробнее рассказать о своем решении, если кто-то посчитает это запутанным.

С уважением, Крис