Question

在 AuthService 类中我无法导入：

   import {JwtHelper} from '@auth0/angular-jwt';

错误：

  Module '"eclipse:angular-login-hide-navbar-
  ngif4/node_modules/@auth0/angular-jwt/index"' has no exported member 'JwtHelper'.

我发了命令：

   npm install @auth0/angular-jwt --save

我有目录：

 - node_modules
  -- @auth0
   --- angular-jwt

Answer 1

在angular2-jwt中看起来是未解决的问题。看here

Answer 2

它有效：

    import {JwtHelperService} from '@auth0/angular-jwt';

但登录无法正常运行。刷新页面用户后登录的用户将被注销。

如何执行此操作登录用户您没有注销？刷新页面时。

AUTH / auth.service.ts

    import {Injectable} from '@angular/core';
    import {Router} from '@angular/router';
    import {BehaviorSubject} from 'rxjs/BehaviorSubject';
    import {User} from './user';
    import {Http, Headers, RequestOptions, Response} from '@angular/http';
    import 'rxjs/add/operator/map';
    import 'rxjs/add/operator/toPromise';
    import {AppComponent} from '../app.component';
    import {Observable} from 'rxjs/';
    import {JwtHelperService} from '@auth0/angular-jwt';



    @Injectable()

    export class AuthService {

      private loggedIn = new BehaviorSubject<boolean>(false);
      private loggedUser = new BehaviorSubject<User>(<User>{});
      private loggedPassword = new BehaviorSubject<User>(<User>{});
      result: any;

      _loggedIn: boolean;


      get isLoggedIn() {
        return this.loggedIn.asObservable();
      }

      constructor(private router: Router, private _http: Http, public jwtHelperService: JwtHelperService) {

      }


        login(user: User) {
            this.getUsers().subscribe(data => {

                for (const it of data) {

                    if (user.userName === it.name && user.password === it.password) {


                        this._loggedIn = true;
                        this.loggedIn.next(true);
                        this.loggedUser.next(user);
                        this.loggedPassword.next(user);
                        this.router.navigate(['/']);          


                        this.loggedIn_test();

                    }
                }
            });
       }



        getUsers() {  

            return this._http.get('/api/users').map(result => this.result = result.json().data);
        }

        loggedIn_test() {
            const token: string = this.jwtHelperService.tokenGetter();

            if (!token) {
              return false;
            }

            const tokenExpired: boolean = this.jwtHelperService.isTokenExpired(token);

            return !tokenExpired;


        }

      /*

        logout() {
          this.loggedIn.next(false);
          this.router.navigate(['/login']);
        }
      */
    }

AUTH / auth.guard.ts：

import {Injectable} from '@angular/core';
import {
  CanActivate,
  ActivatedRouteSnapshot,
  RouterStateSnapshot,
  Router
} from '@angular/router';
import {AuthService} from './auth.service';
import {Observable} from 'rxjs/Observable';
import 'rxjs/add/operator/take';
import 'rxjs/add/operator/map';


@Injectable()

export class AuthGuard implements CanActivate {
  constructor(
    private authService: AuthService,
    private router: Router
  ) {}

  canActivate(next: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> {
    return this.authService.isLoggedIn
      .take(1)
      .map((isLoggedIn: boolean) => {
        if (!isLoggedIn && !this.authService.loggedIn_test()) {  
          localStorage.removeItem('token');
          this.router.navigate(['/login']);
          return false;
        }
        return true;
      });
  }
}

模块＆＃34; node_modules / @ auth0 / angular-jwt / index＆＃34;＆＃39;没有出口会员＆JwtHelper＆＃39;

2 个答案: