修改路径
This commit is contained in:
小海
61
src/app/services/component-state.service.ts
Normal file
61
src/app/services/component-state.service.ts
Normal file
@@ -0,0 +1,61 @@
|
||||
import {Injectable} from '@angular/core';
|
||||
import {filter} from 'rxjs/operators';
|
||||
import {NavigationEnd, Router, RouterEvent} from '@angular/router';
|
||||
import {Observable, of, Subscriber} from 'rxjs';
|
||||
|
||||
@Injectable({
|
||||
providedIn: 'root'
|
||||
})
|
||||
export class ComponentStateService {
|
||||
|
||||
constructor(private router: Router) {
|
||||
this.watchRouterChange()
|
||||
}
|
||||
|
||||
visible = {
|
||||
header: true,
|
||||
footer: true,
|
||||
globalBackToTop: true
|
||||
}
|
||||
|
||||
currentPath: string
|
||||
getCurrentRouterPath = () => this.currentPath;
|
||||
|
||||
watchRouterChange() {
|
||||
let subscriber: Subscriber<string>;
|
||||
const ob = new Observable(o => subscriber = o);
|
||||
this.router.events.pipe(filter(e => e instanceof NavigationEnd)).subscribe((e: RouterEvent) => {
|
||||
// indexOf ==> -1/index
|
||||
const indexOfParam = e.url.indexOf('?');
|
||||
const path = e.url.substr(0, indexOfParam === -1 ? e.url.length : indexOfParam);
|
||||
// lastIndexOf ==> 0/index
|
||||
const indexOf = path.lastIndexOf('/');
|
||||
const prefix = path.substr(0, indexOf === 0 ? path.length : indexOf);
|
||||
this.dealWithPathChange(prefix)
|
||||
this.currentPath = prefix;
|
||||
if (subscriber) subscriber.next(prefix)
|
||||
});
|
||||
return ob;
|
||||
}
|
||||
|
||||
private dealWithPathChange(path) {
|
||||
// tslint:disable-next-line:forin
|
||||
for (const visibleKey in this.visible) {
|
||||
this.visible[visibleKey] = true
|
||||
}
|
||||
switch (path) {
|
||||
case '/admin':
|
||||
this.visible.header = false
|
||||
this.visible.footer = false
|
||||
this.visible.globalBackToTop = false
|
||||
break
|
||||
case '/user':
|
||||
case '/write':
|
||||
this.visible.footer = false
|
||||
this.visible.globalBackToTop = false
|
||||
break;
|
||||
|
||||
default:
|
||||
}
|
||||
}
|
||||
}
|
||||
122
src/app/services/global-user.service.ts
Normal file
122
src/app/services/global-user.service.ts
Normal file
@@ -0,0 +1,122 @@
|
||||
import {Injectable} from '@angular/core';
|
||||
import {LoginReq, User} from '../class/User';
|
||||
import {ApiService} from '../api/api.service';
|
||||
import {Observable, Observer} from 'rxjs';
|
||||
import {Response} from '../class/HttpReqAndResp';
|
||||
import {LocalStorageService} from './local-storage.service';
|
||||
|
||||
@Injectable({
|
||||
providedIn: 'root'
|
||||
})
|
||||
export class GlobalUserService {
|
||||
|
||||
constructor(private apiService: ApiService,
|
||||
private localStorageService: LocalStorageService) {
|
||||
}
|
||||
|
||||
private lastRequestTime: number;
|
||||
|
||||
// 存储订阅者
|
||||
private userObserverArray: Observer<Response<User>>[] = [];
|
||||
|
||||
watchUserInfo(observer: Observer<Response<User>>) {
|
||||
if (this.userObserverArray.indexOf(observer) < 0) this.userObserverArray.push(observer);
|
||||
const user = this.localStorageService.getUser();
|
||||
// 判断本地缓存的用户信息是否符合要求，符合要求返回本地缓存
|
||||
if (this.localStorageService.isLogin() && user && !this.localStorageService.checkNeedNet()) {
|
||||
observer.next(new Response<User>(user));
|
||||
return {
|
||||
unsubscribe() {
|
||||
observer.complete();
|
||||
}
|
||||
}
|
||||
}
|
||||
if (this.lastRequestTime && Date.now() - this.lastRequestTime < 500) {
|
||||
return {
|
||||
unsubscribe: () => {
|
||||
this.userObserverArray.splice(this.userObserverArray.indexOf(observer), 1);
|
||||
observer.complete();
|
||||
}
|
||||
}
|
||||
}
|
||||
// 不符合 请求网络数据并更新缓存
|
||||
// 向订阅者传数据
|
||||
this.lastRequestTime = Date.now();
|
||||
// 获取数据
|
||||
const subscription = this.getUserInfoFromServer();
|
||||
return {
|
||||
unsubscribe: () => {
|
||||
this.userObserverArray.splice(this.userObserverArray.indexOf(observer), 1);
|
||||
observer.complete();
|
||||
subscription.unsubscribe()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 刷新用户信息
|
||||
refreshUserInfo(): void {
|
||||
this.getUserInfoFromServer();
|
||||
}
|
||||
|
||||
login(loginReq: LoginReq, observer: Observer<Response<User>>) {
|
||||
const oob = new Observable<Response<User>>(o => observer = o);
|
||||
const subscription = this.apiService.login(loginReq).subscribe({
|
||||
next: o => {
|
||||
// 登录成功
|
||||
this.localStorageService.setToken(o.result.token);
|
||||
this.localStorageService.setUser(o.result);
|
||||
// this.userObserver.next(o);
|
||||
this.userObserverArray.forEach(ob => ob.next(o))
|
||||
observer.next(o);
|
||||
observer.complete();
|
||||
},
|
||||
error: err => {
|
||||
observer.error(err);
|
||||
observer.complete();
|
||||
}
|
||||
});
|
||||
return {
|
||||
unsubscribe() {
|
||||
observer.complete();
|
||||
subscription.unsubscribe();
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
logout(observer?: Observer<Response<string>>) {
|
||||
// 如果不需要返回消息也ok
|
||||
this.apiService.logout().subscribe(data => {
|
||||
this.localStorageService.clear();
|
||||
this.userObserverArray.forEach(ob => ob.next(new Response<User>(null)))
|
||||
if (observer) {
|
||||
observer.next(data);
|
||||
observer.complete();
|
||||
}
|
||||
},
|
||||
error => {
|
||||
if (observer) {
|
||||
observer.error(error);
|
||||
observer.complete();
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
private getUserInfoFromServer() {
|
||||
return this.apiService.userInfo().subscribe({
|
||||
next: o => {
|
||||
this.localStorageService.setUser(o.result);
|
||||
this.userObserverArray.forEach(ob => ob.next(o));
|
||||
},
|
||||
error: err => {
|
||||
// console.debug('登录过期 token错误 等等');
|
||||
if (err.code === -1) {
|
||||
// 请求重复
|
||||
return
|
||||
}
|
||||
this.localStorageService.removeToken();
|
||||
this.userObserverArray.forEach(ob => ob.next(new Response<User>(null)));
|
||||
this.userObserverArray.forEach(ob => ob.error(err));
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
63
src/app/services/local-storage.service.ts
Normal file
63
src/app/services/local-storage.service.ts
Normal file
@@ -0,0 +1,63 @@
|
||||
import {Injectable} from '@angular/core';
|
||||
import {User} from '../class/User';
|
||||
|
||||
@Injectable({
|
||||
providedIn: 'root'
|
||||
})
|
||||
export class LocalStorageService {
|
||||
|
||||
constructor() {
|
||||
}
|
||||
|
||||
// 30s
|
||||
readonly place = 30 * 1000;
|
||||
|
||||
getToken(): string {
|
||||
return localStorage.getItem('token');
|
||||
}
|
||||
|
||||
setToken(token: string) {
|
||||
localStorage.setItem('t', new Date().valueOf().toString());
|
||||
localStorage.setItem('token', token);
|
||||
}
|
||||
|
||||
removeToken() {
|
||||
localStorage.removeItem('token');
|
||||
}
|
||||
|
||||
isLogin() {
|
||||
return this.getToken() != null;
|
||||
}
|
||||
|
||||
setUser(user: User) {
|
||||
// TODO: 简单加个密
|
||||
localStorage.setItem('t', new Date().valueOf().toString());
|
||||
return localStorage.setItem('user', JSON.stringify(user));
|
||||
}
|
||||
|
||||
getUser(): User {
|
||||
if (!this.checkNeedNet()) {
|
||||
return JSON.parse(localStorage.getItem('user'));
|
||||
}
|
||||
}
|
||||
|
||||
removeUser() {
|
||||
return localStorage.removeItem('user');
|
||||
}
|
||||
|
||||
clear() {
|
||||
localStorage.removeItem('token');
|
||||
localStorage.removeItem('user');
|
||||
return localStorage.removeItem('t');
|
||||
}
|
||||
|
||||
checkNeedNet() {
|
||||
const t: number = Number.parseInt(localStorage.getItem('t'), 10);
|
||||
if (isNaN(t) || new Date().valueOf() - t > this.place) {
|
||||
localStorage.removeItem('t');
|
||||
localStorage.removeItem('user');
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user