#angular #url
Вопрос:
Я пишу угловое приложение для целевой страницы для приложения SaaS. SaaS перенаправляет приложение angular с URL http://localhost:4200/token=<token> -адресом, и angular быстро переходит в компонент home http://localhost:4200/#/ .
Мне нужно получить значение <token> для использования в коде. Как скопировать исходный URL-адрес в приложении angular?
Комментарии:
1. Неужели нет ? в локальном хосте:4200/токен=<токен >?
2. @MikeOne, URL-адрес меняется очень быстро. Я хочу схватить
<token>, как только откроется страница.3. Я понимаю. Но этот указанный URL-адрес в первую очередь кажется недействительным
4. <a rel=»noreferrer noopener nofollow» href=»https://contoso.com/signup?token= contoso.com/signup?token=<токен><токен><авторизация_токен > это форма, которую Microsoft предоставляет ему
5. Так что же это такое ? В конце концов, там. Хорошо. Я думаю, что ваша проблема может заключаться в том, что вы используете стратегию hashLocationStrategy.. в противном случае это не должно быть проблемой, чтобы получить это из активированного маршрута внутри app.компонента..
Ответ №1:
вы можете использовать угловой маршрутизатор, чтобы получить токен, если он отформатирован так, как вы изобразили.
импортируйте угловой маршрутизатор из @angular/router.
constructor(router:Router){}
yourRoute ?:string;
ngOnInit(){
this.yourRoute = this.router.url.split('/').pop();
}
для дальнейшего использования:
если это не сработает, вы можете использовать активированную библиотеку маршрутов.
дай мне знать.
Комментарии:
1. Я пробовал маршрутизатор. Я получаю пустой жетон, потому что он смотрит
http://localhost:4200/#/и неhttp://localhost:4200/token=<token>смотрит . Преобразование происходит очень быстро. Мне пришлось бы перехватить токен до того, как модуль маршрутизации приложения переместит его.2. Могу ли я как-то использовать путь с подстановочными знаками или, может быть, направить меня в активированную библиотеку маршрутов?
3. в этом случае вы можете использовать параметры маршрута, что, вероятно, является лучшим вариантом в любом случае.
4. также исправьте свою маршрутизацию и прекратите использовать хэш. ваш маршрутизатор должен знать о маркере маршрута — и он указывает на локальный хост:4200/#/токен . попробуйте использовать параметры маршрута, я думаю, это решит вашу проблему. angular.io/api/router/ActivatedRoute
Ответ №2:
- В вашем AppRoutingМодуле:
import { Routes } from '@angular/router';
const routes:Routes = [
{
path:'',
component: MainComponent, // Your main component, wich is going to get the token
pathMatch: ‘full’
},
{
path:'/:token',
component: MainComponent, // Your main component, wich is going to get the token
},
... // Your others routes:
{
path:'xxx',
component: XxxComponent
},
{
path:'**',
redirectTo: ''
}
]
NgModule({
imports: [RouterModule.forRoot(routes)],
exports: [RouterModule],
})
export class AppRoutingModule {}
- Не забудьте импортировать в свой AppModule свой AppRoutingModule:
...
import { AppRoutingModule } from './app-routing.module';
...
imports: [
...
AppRoutingModule,
...
],
- В вашем основном компоненте, который получит токен
import { ActivatedRoute } from '@angular/router';
token: string
constructor(private activatedRoute: ActivatedRoute) {}
ngOnInit(): void {
this.token = this.activatedRoute.snapshot.paramMap.get('token');
// If you were to receive countinuosly tokens :
// this.activatedRoute.params.subscribe( _token => this.token = _token);}
Finally, you only have to call angular like this:
**http://localhost:4200/token**
Комментарии:
1. это неправильный ответ, который вы пытаетесь использовать для подстановки маркера маршрута — на самом деле он должен просто создать маршрут маркера — именно так он объединен. токен=<токен>. параметры маршрута — это правильный путь, но ваш маршрут-нет. вы никогда не должны пытаться пересечь корневой маршрут с помощью джокера, это плохая практика.