Когда пользователь некоторое время остается без навигации в приложении, токен недействителен, поэтому, когда пользователь пытается повторить навигацию снова, API выдает ошибку 401, но после входа в систему страница входа не работает.
У меня есть перехватчик, который, когда получает сообщение об ошибке 401, выходит из системы пользователя и переходит к входу в систему, но он не работает, приложение остается в рабочем состоянии, показывая загрузку и перемещение между перехватчиком токена и компонентом.
// это перехватчик, который будет перехватывать все вызовы и, если получит ошибку 401, выйдет из системы пользователя
export class TokenInterceptorService implements HttpInterceptor {
isRefreshingToken: boolean = false;
tokenSubject: BehaviorSubject<string> = new BehaviorSubject<string>(null);
constructor(private injector: Injector, private router: Router,private tost:ToastrService) { }
addToken(req: HttpRequest<any>): HttpRequest<any> {
let storage= this.injector.get(LocalStorageService);
return req.clone({
setParams:{
access_token: `${storage.getCurrentToken()}`
}});
}
intercept(req, next){
let requestWithTokenAdded = this.addToken(req);
return next.handle(requestWithTokenAdded).pipe(
catchError(error => {
if (error instanceof HttpErrorResponse) {
switch ((<HttpErrorResponse>error).status) {
case 400:
return this.handleTokenError401(error);
case 401:
return this.handleTokenError401(error);
}
}
return throwError(error);
}));
}
logoutUser(error:any) {
let storage= this.injector.get(LocalStorageService);
storage.logout();
this.router.navigateByUrl('/login');
this.tost.error("Error Logout");
return throwError(error);
}
handleTokenError401(error:HttpErrorResponse) {
return this.logoutUser(error);
}
}
// это компонент панели мониторинга, по которому я перемещаюсь, когда токен отсутствует
export class DashboardComponent implements OnInit {
newsList:any=[];
constructor(private router:Router, private newsService:NewsService, private customersService:CustomersService) { }
ngOnInit() {
this.loadAllNews();
//this.loadAllCustomers();
}
loadAllNews(){
this.newsService.getAllNews().subscribe(
data=>{
this.newsList=data;
},
error=>{
if(error.status===401)
this.router.navigate(['/login']);
console.log("Desde el DashBoard"+ error);
}
);
}
loadAllCustomers(){
this.customersService.getAllCustomer().subscribe(
data=>{
this.newsList=data;
},
error=>{
console.log("Desde el DashBoard"+error);
}
);
}
}