угловые http_interceptors в возвращении неопределенного на переднем конце - PullRequest
Новая
       9

угловые http_interceptors в возвращении неопределенного на переднем конце

0 голосов
/ 12 февраля 2019

Используя MEAN Stack, я настроил аутентификацию, используя jsonwebtoken, и я могу сгенерировать токен из бэкэнда, используя jsonwebtoken, но он возвращает undefined из службы auth-interceptor на внешнем интерфейсе.см. мои фрагменты ниже.спасибо

служба auth-interceptor.ts 

import { Injectable } from "@angular/core";
import { HttpInterceptor, HttpRequest, HttpEvent, HttpHandler } from '@angular/common/http';
import { Observable } from 'rxjs';

import { AuthService } from './auth.service';

@Injectable()
export class AuthInterceptor implements HttpInterceptor {

    constructor(private authUser: AuthService){}
    intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
        const authToken = this.authUser.getToken();
        console.log(authToken); //but this return undefined
        if(authToken) {
            req = req.clone({
                headers: req.headers.set("Authorization", "Bearer " + authToken)
            });
        }
        return next.handle(req);
    }
}

служба auth-service.ts 

import { Injectable } from "@angular/core";
import { HttpClient } from '@angular/common/http';

import { User } from "./user.model";

@Injectable({ providedIn: "root" })
export class AuthService {
    private token: string;

    constructor(private http: HttpClient) {}

    getToken() {
        return this.token;
    }


    login(Email: string, Password: string) {
        const userAuth: User = { Email: Email, Password: Password, 
            Firstname:null, Lastname:null, CourseStudied:null, AcademyAward:null, 
            Photo:null, id:null, AreaSpecialised:null};
        this.http.post<{token: string}>("http://localhost:3000/api/users/login/", userAuth)
            .subscribe(response => {
                const token = response.token;
                this.token = token;
                console.log(this.token) //this returns the token
            });
    }

}

часть my app.modules.ts 

providers: [
    { provide: HTTP_INTERCEPTORS, useClass: AuthInterceptor, multi: true },
    MDBSpinningPreloader, UsersService,
  ],

мое промежуточное ПО - я также console.log токен, он работает 

 const jwt = require("jsonwebtoken");

module.exports = (req, res, next) => {
    try {
        const token = req.headers.authorization.split(" ")[1];
        jwt.verify(token, "sjoigej34989wejsdijfi!8Z()&iuhusdh3wn2sjj5JDU3u5fksl)k2=SDKOFO322KSMFIIMMK1K4K#@^5JDLK9kskd");
        next();
    } catch (error) {
        res.status(401).json({ message: "You are not authorized!"});
    }
}

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

router.post("/login", (req, res, next) => {
    let fetchedUser;
    User.findOne({Email: req.body.Email}).then(user => {
        if (!user) {
            return res.status(401).json({
                message: 'Auth failed - Either email or password is incorrect'
            });
        }
        fetchedUser = user;
        return bcrpt.compare(req.body.Password, user.Password);
    })
    .then (result => {
        if(!result) {
            return res.status(401).json({
                message: 'Auth failed - Either email or password is incorrect'
            });
        }
        const token = jwt.sign(
            {Email:fetchedUser.Email, userId: fetchedUser._id, username: fetchedUser.Firstname + ' ' + fetchedUser.Lastname},
            "sjoigej34989wejsdijfi!8Z()&iuhusdh3wn2sjj5JDU3u5fksl)k2=SDKOFO322KSMFIIMMK1K4K#@^5JDLK9kskd",
            { expiresIn: "0.25h"}
        );
        res.status(200).json({
            token: token
        });
    })
    .catch(err => {
        return res.status(401).json({
            message: 'Auth failed - Either email or password is incorrect'
        })
    })

токен не попадает в мои auth-interceptor.ts только на внешний интерфейс.пожалуйста, я здесь только новичок, помоги мне.

1 Ответ

0 голосов
/ 12 февраля 2019

Что вам нужно сделать, это сохранить токен в сеансе браузера, а не в самом классе.

Измените метод login в вашем AuthService на: 

login(Email: string, Password: string) {
    const userAuth: User = {
      Email: Email, Password: Password,
      Firstname: null, Lastname: null, CourseStudied: null, AcademyAward: null,
      Photo: null, id: null, AreaSpecialised: null
    };
    this.http.post<{ token: string }>("http://localhost:3000/api/users/login/", userAuth)
      .subscribe(response => {
        const token = response.token;
        localStorage.setItem('token', token);
        console.log(token) //this returns the token
      });
  }

а также добавьте этот метод: 

getToken(): string {
    return localStorage.getItem('auth_token');
}

И измените метод intercept в вашем AuthInterceptor на: 

intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
        const authToken = this.authenticationService.getToken();
        console.log(authToken); //but this return undefined
        if(authToken) {
            req = req.clone({
                headers: req.headers.set("Authorization", "Bearer " + authToken)
            });
        }
        return next.handle(req);
}
...