完善路由守卫功能

This commit is contained in:
小海
2020-05-15 20:46:02 +08:00
parent e54726b4e8
commit b266340ef1
4 changed files with 23 additions and 10 deletions

View File

@@ -33,7 +33,8 @@ export class GlobalUserService {
} }
if (this.lastRequestTime && Date.now() - this.lastRequestTime < 1000) { if (this.lastRequestTime && Date.now() - this.lastRequestTime < 1000) {
return { return {
unsubscribe() { unsubscribe: () => {
this.userObserverArray.splice(this.userObserverArray.indexOf(observer), 1);
observer.complete(); observer.complete();
} }
} }
@@ -44,7 +45,8 @@ export class GlobalUserService {
// 获取数据 // 获取数据
const subscription = this.getUserInfoFromServer(); const subscription = this.getUserInfoFromServer();
return { return {
unsubscribe() { unsubscribe:()=>{
this.userObserverArray.splice(this.userObserverArray.indexOf(observer), 1);
observer.complete(); observer.complete();
subscription.unsubscribe() subscription.unsubscribe()
} }

View File

@@ -9,8 +9,8 @@ export class LocalStorageService {
constructor() { constructor() {
} }
// 1分钟 // 30s
readonly place = 60 * 1000; readonly place = 30 * 1000;
getToken(): string { getToken(): string {
return localStorage.getItem('token'); return localStorage.getItem('token');

View File

@@ -8,6 +8,7 @@ const routes: Routes = [
{ {
path: '', path: '',
component: AdminComponent, component: AdminComponent,
canActivate: [AuthGuard],
children: [ children: [
{ {
path: 'article', path: 'article',

View File

@@ -1,5 +1,5 @@
import {Injectable} from '@angular/core'; import {Injectable} from '@angular/core';
import {CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot, UrlTree} from '@angular/router'; import {CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot, UrlTree, Router} from '@angular/router';
import {Observable} from 'rxjs'; import {Observable} from 'rxjs';
import {User} from '../../class/User'; import {User} from '../../class/User';
import {GlobalUserService} from '../../services/global-user.service'; import {GlobalUserService} from '../../services/global-user.service';
@@ -9,28 +9,36 @@ import {GlobalUserService} from '../../services/global-user.service';
}) })
export class AuthGuard implements CanActivate { export class AuthGuard implements CanActivate {
constructor(private userService: GlobalUserService) { constructor(private userService: GlobalUserService, private router: Router) {
userService.watchUserInfo({ userService.watchUserInfo({
complete: () => null, complete: () => null,
error: (err) => { error: (err) => {
// 未登录 重定向 // 请求重复
console.log(err);
if (err.code !== -1) {
this.userInfo = null;
this.router.navigateByUrl(this.loginPath);
}
}, },
next: data => { next: data => {
this.userInfo = data.result this.userInfo = data.result
console.log(this.path);
// todo :用户信息更新时 重新判断下path
} }
}) })
} }
userInfo: User; userInfo: User;
private path: string; private path: string;
private readonly loginPath: string = '/user/login';
canActivate( canActivate(
next: ActivatedRouteSnapshot, next: ActivatedRouteSnapshot,
state: RouterStateSnapshot): Observable<boolean | UrlTree> | Promise<boolean | UrlTree> | boolean | UrlTree { state: RouterStateSnapshot): Observable<boolean | UrlTree> | Promise<boolean | UrlTree> | boolean | UrlTree {
const path = state.url.indexOf('?') > 0 ? state.url.substr(0, state.url.indexOf('?')) : state.url; const path = state.url.indexOf('?') > 0 ? state.url.substr(0, state.url.indexOf('?')) : state.url;
this.path = path this.path = path
if (path.split('/')[1] === 'admin' && !this.userInfo) {
this.router.navigateByUrl(this.loginPath);
return false;
}
switch (path) { switch (path) {
case '/admin/article': case '/admin/article':
case '/admin/category': case '/admin/category':
@@ -39,7 +47,9 @@ export class AuthGuard implements CanActivate {
case '/admin/update': case '/admin/update':
case '/admin/user': case '/admin/user':
case '/admin/visitor': case '/admin/visitor':
if (!this.userInfo || this.userInfo.role !== 'admin') return false; if (this.userInfo.role !== 'admin') {
return false;
}
} }
return true; return true;
} }