Блог

У меня есть следующий файл службы аутентификации

 export class AuthService {

    url = environment.url;
    user = null;
    authenticationState = new BehaviorSubject(false);

    constructor(private http: HttpClient, private helper: JwtHelperService, private storage: Storage,
                private plt: Platform, private alertController: AlertController) {
        this.plt.ready().then(() => {
            this.checkToken();
        });
    }

    getToken() {
        return this.storage.get(TOKEN_KEY).then(token => {
           return token;
        });
    }

    checkToken() {
        this.storage.get(TOKEN_KEY).then(token => {
            if (token) {
                let decoded = this.helper.decodeToken(token);
                let isExpired = this.helper.isTokenExpired(token);
                if (!isExpired) {
                    this.user = decoded;
                    this.authenticationState.next(true);
                } else {
                    this.storage.remove(TOKEN_KEY);
                }
            }
        });
    }

    register(credentials) {
        return this.http.post(`${this.url}/auth/register`, credentials).pipe(
            catchError(e => {
                this.showAlert(e.error.msg);
                throw new Error(e);
            })
        );
    }

    login(credentials) {
        return this.http.post(`${this.url}/auth/login`, credentials)
            .pipe(
                tap(res => {
                    this.storage.set(TOKEN_KEY, res['token']);
                    this.user = this.helper.decodeToken(res['token']);
                    this.authenticationState.next(true);
                }),
                catchError(e => {
                    this.showAlert(e.error.msg);
                    throw new Error(e);
                })
            );
    }

    logout() {
        this.storage.remove(TOKEN_KEY).then(() => {
            this.authenticationState.next(false);
        });
    }
}
 

Я пытаюсь вставить access_token http-запрос, используя следующий перехватчик

 
export class AuthInterceptor implements HttpInterceptor {
    constructor(private authService: AuthService) {
    }

    intercept(req: HttpRequest<any>, next: HttpHandler) {

        this.authService.getToken().then((accessToken) => {

            req = req.clone({
                setHeaders: {
                    "Content-Type": "application/json",
                    Authorization: "Bearer "   accessToken
                }
            });
        });


        return next.handle(req);
    }
}
 

Но он не работает должным образом, и после входа в систему он регистрирует пользователя и перенаправляет на страницу входа.

В чем моя ошибка с перехватчиком?

Спасибо

в вашем коде return строка вычисляется перед обратным вызовом, который обновляет объект запроса. чтобы исправить это, return должен быть частью асинхронной цепочки. Пример исправления:

 
export class AuthInterceptor implements HttpInterceptor {
    constructor(private authService: AuthService) {
    }

    intercept(req: HttpRequest<any>, next: HttpHandler) {

        return from(this.authService.getToken().then((accessToken) => {

            return req.clone({
                setHeaders: {
                    "Content-Type": "application/json",
                    Authorization: "Bearer "   accessToken
                }
            });
        })).pipe(switchMap(newReq => next.handle(newReq)));

    }
}