angular登陆后转跳之前页面
之前做了关于登陆认证的功能，但没有实现登陆后转跳之前的url。
使用angular前后端分离后，前后的交互都是异步的，之前MVC那一套的302在这里已经不适用了。但可以借鉴之前的思想，在url中的GET参数（问号后面的值）中传递要转跳的url。
使用拦截器转跳登陆页面并携带next转跳url
import { Injectable, Injector } from '@angular/core';
import { ActivatedRoute, Router } from "@angular/router";
import { Location } from '@angular/common';
import { HttpEvent, HttpHandler, HttpInterceptor, HttpRequest, HttpResponse, HttpErrorResponse } from '@angular/common/http';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/do';
@Injectable()
export class AuthInterceptor implements HttpInterceptor {
constructor(private router: Router) {}
intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
return next.handle(request).do((event: HttpEvent<any>) => {
if (event instanceof HttpResponse) {
// do stuff with response if you want
}
}, (err: any) => {
if (err instanceof HttpErrorResponse) {
if (err.status === 401) {
const next = this.location.path();
const url = next.split('?')[0];
if (url !== '/passport/login') {
this.router.navigateByUrl(`/passport/login?next=${next}`);
}
}
}
});
}
}
登陆成功获取转跳url并转跳
...
constructor(
private router: Router,
private route: ActivatedRoute,
)
...
// 如果有next则转跳next，否则转跳‘/’
this.route.queryParams.subscribe((params: Params) => {
const next = params['next'] ? params['next'] : '/';
this.router.navigate([next]);
});
...