راهاندازی Http Interceptor در Angular
نویسنده: جواد رسولی
تاریخ: ۱۳۹۶/۰۴/۱۶ ۲۳:۰
آدرس: www.dntips.ir
| مطالب | ۳۶۹۴ |
| نویسندگان | ۲۷۶ |
| گروههای مطالب | ۱۰۲۴ |
| نقشههای راه | ۱۱۹ |
| دورهها | ۱۴ |
| اشتراکها | ۱۷۹۱۴ |
let headers = new Headers();
let token = localStorage.getItem('token');
headers.append('Authorization', 'bearer ' + token);
this.http.get('/api/controller/action', { headers: headers }) import { Injectable } from "@angular/core";
import { ConnectionBackend, RequestOptions, Request, RequestOptionsArgs, Response, Http, Headers } from "@angular/http";
import { Observable } from "rxjs/Rx";
import 'rxjs/add/operator/catch';
import 'rxjs/add/observable/throw';
@Injectable()
export class InterceptedHttp extends Http {
constructor(backend: ConnectionBackend, defaultOptions: RequestOptions) {
super(backend, defaultOptions);
}
request(url: string | Request, options?: RequestOptionsArgs): Observable<Response> {
// اصلاح url
if (typeof (url) === 'string')
url = this.updateUrl((url as string));
else
url.url = this.updateUrl((url as Request).url);
return super.request(url, this.getRequestOptionArgs(options)).catch((err: Response) => {
// Exception handling
switch (err.status) {
case 400:
console.log('interceptor: 400');
console.log(err);
break;
case 404:
console.log('interceptor: 404');
console.log(err);
break;
case 500:
console.log('interceptor: 500');
console.log(err);
break;
case 401:
console.log('interceptor: 401');
console.log(err);
break;
case 403:
console.log('interceptor: 403');
console.log(err);
break;
default:
console.log('interceptor: ' + err.status);
console.log(err);
}
return Observable.throw(err);
});
}
private updateUrl(req: string) {
return `http://localhost:61366/api/${req}`
}
private getRequestOptionArgs(options?: RequestOptionsArgs): RequestOptionsArgs {
if (options == null) {
options = new RequestOptions();
}
if (options.headers == null) {
options.headers = new Headers();
}
// هدر درخواست تنظیم
let token = localStorage.getItem('token');
options.headers.append('Authorization', 'bearer ' + token);
return options;
}
} //…
providers: [{
provide: Http,
useFactory: (backend: XHRBackend, options: RequestOptions) => {
return new InterceptedHttp(backend, options);
},
deps: [XHRBackend, RequestOptions],
}],
//… import { Http, URLSearchParams } from '@angular/http';
//…
constructor(private _http: Http) { }
ngOnInit() {
let urlSearchParams: URLSearchParams = new URLSearchParams();
urlSearchParams.append('page', page.toString());
urlSearchParams.append('count', count.toString());
let params = urlSearchParams.toString();
this._http.get(`/cars`, { params: params })
.subscribe(result => {
console.log('service: Succ');
this.cars = result.json();
}, err => {
console.log('service: error');
});
}
//… import { HttpRequest, HttpHandler, HttpEvent } from '@angular/common/http';
@Injectable()
class JWTInterceptor implements HttpInterceptor {
constructor(private userService: UserService) {}
intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
const JWT = `Bearer ${this.userService.getToken()}`;
req = req.clone({
setHeaders: {
Authorization: JWT
}
});
return next.handle(req);
}
}