потеря данных при refre sh страница angular 8

Question

я теряю свой тип роли при ссылке sh на страницу, которую я создал, если пользователь Admin отображает кнопку на панели инструментов и пользователь вошел в систему, я получаю токен JWT с сервера и помещаю его в localalstorage и внутри токена userID и Роль

в моем сервисе я использовал BehaviorSubject в качестве строки, и у меня есть функция, взять токен и разделить его, чтобы взять часть тела и взять роль, затем декодировать его

так если вы можете мне помочь или что-то похожее на мою проплему (я видел, как эта проплема, но все говорят, поместите значение в LocalStorage, и я уже поместил его

AccountServicesService

test$ :BehaviorSubject<string> = new BehaviorSubject('') ;

Login(log: LoginModel): Observable<any> {
   return this.http.post<any>(this.HTTP_URL + 'ApplicationUser/Login' ,
   log, this.headers).pipe(map(x=> {
   this.test$.next(this.roleTypeForCheck(x.token));
   return x;
}));
}

roleTypeForCheck(token): string {
var payLoad = JSON.parse(window.atob(token.split('.')[1]));
var userRole = payLoad.role;
return userRole;
}

LoginComponent

login(){
if(this.loginForm.valid){
  this.validatLoginModel();
  this.service.Login(this.log).subscribe((res:any) => {
    localStorage.setItem('token',res.token);
    this.route.navigate(['home']);
  }, err => {
    if(err.status === 401){
      this.message = 'Email is not confirmed yet!!..Check Your Email';
    } else if(err.status === 400){
      this.message = 'username or password is incorrect';
    } else if(err.status === 500) {
      this.message = 'something wrong..try again later';
    }
    console.log(err);
  });
}
}

NavBarComponent.ts

ngOnInit(): void {
console.log('init');
this.serv.test$.subscribe(res =>{
  this.userRole = res;
  console.log('subscr');
},err =>{
  alert(err.error);
});

NavBarComponent. html

<li class="nav-item">
    <a class="nav-link" routerLink="dashboard" *ngIf="(this.userRole) === 'Admin'">Dashboard</a>
  </li>

Answer 1

Я предполагаю, что вы не хотите, чтобы пользователь снова входил в систему после обновления страницы sh. Вы уже сохранили токен в localStorage, но после ссылки sh вы должны прочитать его из того же места. Вы можете добавить метод, например, в ваш AccountServicesService:

  getTokenFromLocalStorageWithoutLogin() {
    const token = localStorage.getItem('token');
    this.test$.next(this.roleTypeForCheck(token));
  }