#angular
#angular
Вопрос:
Я не знаю, почему моя панель навигации отображается также на моей странице входа в систему. Во-вторых, когда я вхожу в систему, я получаю токен и могу сохранить его в своем localstorage , но, тем не менее, он не перенаправляет меня на первую страницу, теперь я собираюсь написать, что я сделал, вот мой module.ts.
RouterModule.forRoot([
{path:'',component:LoginComponent},
{path:'app-events',component:EventsComponent},
{path:'app-turbine-comparison',component:TurbineComparisonComponent}
])
и вот моя функция входа в систему:
signIn(credntials){
this.authaervice.login(credntials)
.subscribe(result=>{
if(result){
localStorage.setItem('token',result.toString());
this.router.navigate(['/']);
}
else
this.invalidLogin=true;
})
}
мой app.html:
<nav>my nabvar stuff</nav>
<router-outlet></router-outlet>
Моя панель навигации находится перед маршрутизатором-розеткой
Комментарии:
1. Пожалуйста, подробнее расскажите о том, что происходит и что вам нужно сделать, а также поделитесь своим app.component.html если возможно,
2. Я бы не рекомендовал хранить токен в localStorage. Любой скрипт, который вы включаете на свою веб-страницу, может читать localStorage для вашего сайта. Попробуйте вместо этого использовать аутентификацию cookie для своего веб-сайта.
3. @Pieterjan извините, я не понял, в чем проблема с localstorage
4. Каждый скрипт, который вы включаете на свою веб-страницу, может читать localStorage для вашего сайта. Итак, если вы используете Youtube
iframe_api.jsна своем веб-сайте, этот скрипт может прочитать localStorage для вашего сайта для посетителя. Что позволяет украсть JWT, возможно, передать его на сервер в России и выполнять запросы от имени посетителей. Теперь, с другой стороны, с аутентификацией cookie скрипту даже не нужно извлекать какую-либо информацию для выполнения аутентифицированных запросов, но это все равно более безопасно, чем просто хранить JWT в localstorage. Продолжение…5. Таким образом, наилучшим подходом является использование комбинации аутентификации с использованием файлов cookie (проверенный механизм аутентификации для веб-приложений) и использование недолговечного токена CSRF для защиты от атак CSRF. Я уже прочитал следующую документацию angular , которая охватывает угловую сторону защиты CSRF, но я все еще изучаю этот материал сам.
Ответ №1:
Какая у вас домашняя страница? У вас нет домашней страницы в вашем маршрутизаторе, и все же вы переходите по ‘/’ при успешном входе в систему, что снова перенаправляет вас на страницу входа, определенную здесь :
{path:'',component:LoginComponent},
Ваша панель навигации отображается на вашей странице входа в систему, потому что она находится за пределами вашего маршрутизатора, поэтому она будет отображаться на каждой странице.
В вашем компоненте приложения вы можете просто прочитать токен из localstorage и отобразить навигационный компонент только при наличии действительного токена :
<nav *ngIf="token">my nabvar stuff</nav>
<router-outlet></router-outlet>
И в вашем app.component.ts ->
token: string;
ngOnInit(){
this.token = this.readToken();
}
readToken(): string {
return localStorage.getItem('token');
}