Как ловить http ошибки с картой

Question

Я кодировал сторож, который при доступе к http api и http возвращает true | 200 или ошибка: неавторизован | 401

Я могу справиться с охраной с http | 200, но на карте я не могу поймать ошибку 401, так как я могу поймать 401 в pipe(map())

мой защитный код

import { Injectable } from '@angular/core';
import { CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot , Router } from '@angular/router';
import { AuthenticationService } from '../services/authentication.service'
import { Observable } from 'rxjs';
import { map } from 'rxjs/operators';

@Injectable({
  providedIn: 'root'
})
export class IsSigninGuard implements CanActivate {

  constructor( private _auth:AuthenticationService, private router:Router ) {}

  canActivate(
    next: ActivatedRouteSnapshot,
    state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean {

    return this._auth.authState().pipe(
      map(status=>{
        if(!status) { this.router.navigate(['/auth/signin']); return false;}
        return true
      })
    )


  }
}

Answer 1

Вы можете изменить код следующим образом:

map(status=>{
        if(!status) { this.router.navigate(['/auth/signin']); return false;}
        return true
      }),
catchError((err, caught) => {
          //this you can do what do you want when error
         });

Answer 2

Измените свой код следующим образом:

import { Injectable } from '@angular/core';
import { CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot , Router } from '@angular/router';
import { AuthenticationService } from '../services/authentication.service'
import { Observable, of } from 'rxjs';
import { map, catchError } from 'rxjs/operators';

@Injectable({
  providedIn: 'root'
})
export class IsSigninGuard implements CanActivate {

  constructor( private _auth:AuthenticationService, private router:Router ) {}

  canActivate(
    next: ActivatedRouteSnapshot,
    state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean {

    return this._auth.authState().pipe(
      map(status=>{
        if(!status) { this.router.navigate(['/auth/signin']); return false;}
        return true
      }), catchError(err => {
           console.log(err);
          // Do some stuff with your error and return Empty Obserable.
          return of([]))
         }))    
  }
}

Подробнее о catchError здесь