From fc9c9ff65a0dd98958c22055bc666a4247403b5f Mon Sep 17 00:00:00 2001 From: Baron Chen Date: Mon, 14 May 2018 21:39:45 +1000 Subject: [PATCH] Migrate from http module to httpClient module --- src/Web/WebSPA/Client/modules/app.module.ts | 4 +- .../Client/modules/basket/basket.service.ts | 10 +-- .../modules/campaigns/campaigns.service.ts | 10 +-- .../Client/modules/catalog/catalog.service.ts | 14 ++-- .../Client/modules/orders/orders.service.ts | 10 +-- .../shared/services/configuration.service.ts | 8 +- .../modules/shared/services/data.service.ts | 75 +++++++++---------- .../shared/services/security.service.ts | 25 +++---- .../Client/modules/shared/shared.module.ts | 5 +- 9 files changed, 77 insertions(+), 84 deletions(-) diff --git a/src/Web/WebSPA/Client/modules/app.module.ts b/src/Web/WebSPA/Client/modules/app.module.ts index 6a04ea953..5b12db2e8 100644 --- a/src/Web/WebSPA/Client/modules/app.module.ts +++ b/src/Web/WebSPA/Client/modules/app.module.ts @@ -1,7 +1,7 @@ import { NgModule, NgModuleFactoryLoader } from '@angular/core'; import { BrowserModule } from '@angular/platform-browser'; // import { FormsModule } from '@angular/forms'; -import { HttpModule } from '@angular/http'; +import { HttpClientModule } from '@angular/common/http'; import { RouterModule } from '@angular/router'; import { routing } from './app.routes'; @@ -18,7 +18,7 @@ import { CampaignsModule } from './campaigns/campaigns.module'; imports: [ BrowserModule, routing, - HttpModule, + HttpClientModule, // Only module that app module loads SharedModule.forRoot(), CatalogModule, diff --git a/src/Web/WebSPA/Client/modules/basket/basket.service.ts b/src/Web/WebSPA/Client/modules/basket/basket.service.ts index fef74974e..4ccd5a5ee 100644 --- a/src/Web/WebSPA/Client/modules/basket/basket.service.ts +++ b/src/Web/WebSPA/Client/modules/basket/basket.service.ts @@ -1,5 +1,5 @@ import { Injectable } from '@angular/core'; -import { Response, Headers } from '@angular/http'; +import { HttpResponse, HttpHeaders } from '@angular/common/http'; import { Router } from '@angular/router'; import { DataService } from '../shared/services/data.service'; @@ -68,14 +68,14 @@ export class BasketService { setBasket(basket): Observable { let url = this.purchaseUrl + '/api/v1/basket/'; this.basket = basket; - return this.service.post(url, basket).map((response: Response) => { + return this.service.post(url, basket).map((response: HttpResponse) => { return true; }); } setBasketCheckout(basketCheckout): Observable { let url = this.basketUrl + '/api/v1/b/basket/checkout'; - return this.service.postWithId(url, basketCheckout).map((response: Response) => { + return this.service.postWithId(url, basketCheckout).map((response: HttpResponse) => { this.basketEvents.orderCreated(); return true; }); @@ -83,12 +83,12 @@ export class BasketService { getBasket(): Observable { let url = this.basketUrl + '/api/v1/b/basket/' + this.basket.buyerId; - return this.service.get(url).map((response: Response) => { + return this.service.get(url).map((response: HttpResponse) => { if (response.status === 204) { return null; } - return response.json(); + return response.body; }); } diff --git a/src/Web/WebSPA/Client/modules/campaigns/campaigns.service.ts b/src/Web/WebSPA/Client/modules/campaigns/campaigns.service.ts index 2a8973322..7482fd143 100644 --- a/src/Web/WebSPA/Client/modules/campaigns/campaigns.service.ts +++ b/src/Web/WebSPA/Client/modules/campaigns/campaigns.service.ts @@ -1,5 +1,5 @@ import { Injectable } from '@angular/core'; -import { Response } from '@angular/http'; +import { HttpResponse } from '@angular/common/http'; import { DataService } from '../shared/services/data.service'; import { ICampaign } from '../shared/models/campaign.model'; @@ -36,16 +36,16 @@ export class CampaignsService { let url = this.marketingUrl + '/api/v1/m/campaigns/user'; url = url + '?pageIndex=' + pageIndex + '&pageSize=' + pageSize; - return this.service.get(url).map((response: Response) => { - return response.json(); + return this.service.get(url).map((response: HttpResponse) => { + return response.body; }); } getCampaign(id: number): Observable { let url = this.marketingUrl + '/api/v1/m/campaigns/' + id; - return this.service.get(url).map((response: Response) => { - return response.json(); + return this.service.get(url).map((response: HttpResponse) => { + return response.body; }); } } diff --git a/src/Web/WebSPA/Client/modules/catalog/catalog.service.ts b/src/Web/WebSPA/Client/modules/catalog/catalog.service.ts index fc5bc4c5e..baa3e7d92 100644 --- a/src/Web/WebSPA/Client/modules/catalog/catalog.service.ts +++ b/src/Web/WebSPA/Client/modules/catalog/catalog.service.ts @@ -1,5 +1,5 @@ import { Injectable } from '@angular/core'; -import { Response } from '@angular/http'; +import { HttpResponse } from '@angular/common/http'; import { DataService } from '../shared/services/data.service'; import { ConfigurationService } from '../shared/services/configuration.service'; @@ -35,20 +35,20 @@ export class CatalogService { url = url + '?pageIndex=' + pageIndex + '&pageSize=' + pageSize; - return this.service.get(url).map((response: Response) => { - return response.json(); + return this.service.get(url).map((response: HttpResponse) => { + return response.body; }); } getBrands(): Observable { - return this.service.get(this.brandUrl).map((response: Response) => { - return response.json(); + return this.service.get(this.brandUrl).map((response: HttpResponse) => { + return response.body; }); } getTypes(): Observable { - return this.service.get(this.typesUrl).map((response: Response) => { - return response.json(); + return this.service.get(this.typesUrl).map((response: HttpResponse) => { + return response.body; }); }; } diff --git a/src/Web/WebSPA/Client/modules/orders/orders.service.ts b/src/Web/WebSPA/Client/modules/orders/orders.service.ts index 5c563f836..522f7d74a 100644 --- a/src/Web/WebSPA/Client/modules/orders/orders.service.ts +++ b/src/Web/WebSPA/Client/modules/orders/orders.service.ts @@ -1,5 +1,5 @@ import { Injectable } from '@angular/core'; -import { Response } from '@angular/http'; +import { HttpResponse } from '@angular/common/http'; import { DataService } from '../shared/services/data.service'; import { IOrder } from '../shared/models/order.model'; @@ -31,16 +31,16 @@ export class OrdersService { getOrders(): Observable { let url = this.ordersUrl + '/api/v1/o/orders'; - return this.service.get(url).map((response: Response) => { - return response.json(); + return this.service.get(url).map((response: HttpResponse) => { + return response.body; }); } getOrder(id: number): Observable { let url = this.ordersUrl + '/api/v1/o/orders/' + id; - return this.service.get(url).map((response: Response) => { - return response.json(); + return this.service.get(url).map((response: HttpResponse) => { + return response.body; }); } diff --git a/src/Web/WebSPA/Client/modules/shared/services/configuration.service.ts b/src/Web/WebSPA/Client/modules/shared/services/configuration.service.ts index ea95275e0..781f14ebc 100644 --- a/src/Web/WebSPA/Client/modules/shared/services/configuration.service.ts +++ b/src/Web/WebSPA/Client/modules/shared/services/configuration.service.ts @@ -1,5 +1,5 @@ import { Injectable } from '@angular/core'; -import { Http, Response, RequestOptionsArgs, RequestMethod, Headers } from '@angular/http'; +import { HttpClient, HttpResponse, HttpHeaders } from '@angular/common/http'; import { IConfiguration } from '../models/configuration.model'; import { StorageService } from './storage.service'; @@ -19,14 +19,14 @@ export class ConfigurationService { settingsLoaded$ = this.settingsLoadedSource.asObservable(); isReady: boolean = false; - constructor(private http: Http, private storageService: StorageService) { } + constructor(private http: HttpClient, private storageService: StorageService) { } load() { const baseURI = document.baseURI.endsWith('/') ? document.baseURI : `${document.baseURI}/`; let url = `${baseURI}Home/Configuration`; - this.http.get(url).subscribe((response: Response) => { + this.http.get(url).subscribe((data: IConfiguration) => { console.log('server settings loaded'); - this.serverSettings = response.json(); + this.serverSettings = data; console.log(this.serverSettings); this.storageService.store('identityUrl', this.serverSettings.identityUrl); this.storageService.store('marketingUrl', this.serverSettings.marketingUrl); diff --git a/src/Web/WebSPA/Client/modules/shared/services/data.service.ts b/src/Web/WebSPA/Client/modules/shared/services/data.service.ts index 26f7801ca..f3bd659d1 100644 --- a/src/Web/WebSPA/Client/modules/shared/services/data.service.ts +++ b/src/Web/WebSPA/Client/modules/shared/services/data.service.ts @@ -1,5 +1,5 @@ import { Injectable } from '@angular/core'; -import { Http, Response, RequestOptionsArgs, RequestMethod, Headers } from '@angular/http'; +import { HttpClient, HttpHeaders, HttpResponse, HttpErrorResponse } from '@angular/common/http'; import 'rxjs/Rx'; import { Observable } from 'rxjs/Observable'; @@ -15,96 +15,89 @@ import { Guid } from '../../../guid'; // is pending to do for the SPA app @Injectable() export class DataService { - constructor(private http: Http, private securityService: SecurityService) { } + constructor(private http: HttpClient, private securityService: SecurityService) { } - get(url: string, params?: any): Observable { - let options: RequestOptionsArgs = {}; + get(url: string, params?: any): Observable> { + let headers: HttpHeaders = new HttpHeaders(); if (this.securityService) { - options.headers = new Headers(); - options.headers.append('Authorization', 'Bearer ' + this.securityService.GetToken()); + headers = headers.set('Authorization', 'Bearer ' + this.securityService.GetToken()); } - return this.http.get(url, options).map( - (res: Response) => { - return res; - }).catch(this.handleError); + return this.http.get(url, {headers: headers, observe: "response"}).map( + (res: HttpResponse) => res).catch(this.handleError); } - postWithId(url: string, data: any, params?: any): Observable { + postWithId(url: string, data: any, params?: any): Observable> { return this.doPost(url, data, true, params); } - post(url: string, data: any, params?: any): Observable { + post(url: string, data: any, params?: any): Observable> { return this.doPost(url, data, false, params); } - putWithId(url: string, data: any, params?: any): Observable { + putWithId(url: string, data: any, params?: any): Observable> { return this.doPut(url, data, true, params); } - private doPost(url: string, data: any, needId: boolean, params?: any): Observable { - let options: RequestOptionsArgs = {}; + private doPost(url: string, data: any, needId: boolean, params?: any): Observable> { + let headers: HttpHeaders = new HttpHeaders(); - options.headers = new Headers(); if (this.securityService) { - options.headers.append('Authorization', 'Bearer ' + this.securityService.GetToken()); + headers = headers.set('Authorization', 'Bearer ' + this.securityService.GetToken()); } if (needId) { let guid = Guid.newGuid(); - options.headers.append('x-requestid', guid); + headers = headers.set('x-requestid', guid); } - return this.http.post(url, data, options).map( - (res: Response) => { + return this.http.post(url, data, {headers: headers, observe:'response'}).map( + (res: HttpResponse) => { return res; }).catch(this.handleError); } - private doPut(url: string, data: any, needId: boolean, params?: any): Observable { - let options: RequestOptionsArgs = {}; - - options.headers = new Headers(); + private doPut(url: string, data: any, needId: boolean, params?: any): Observable> { + let headers: HttpHeaders = new HttpHeaders(); if (this.securityService) { - options.headers.append('Authorization', 'Bearer ' + this.securityService.GetToken()); + headers = headers.set('Authorization', 'Bearer ' + this.securityService.GetToken()); } if (needId) { let guid = Guid.newGuid(); - options.headers.append('x-requestid', guid); + headers = headers.set('x-requestid', guid); } - return this.http.put(url, data, options).map( - (res: Response) => { + return this.http.put(url, data, {headers: headers, observe: 'response'}).map( + (res: HttpResponse) => { return res; }).catch(this.handleError); } delete(url: string, params?: any) { - let options: RequestOptionsArgs = {}; + let headers: HttpHeaders = new HttpHeaders(); if (this.securityService) { - options.headers = new Headers(); - options.headers.append('Authorization', 'Bearer ' + this.securityService.GetToken()); + headers = headers.set('Authorization', 'Bearer ' + this.securityService.GetToken()); } console.log('data.service deleting'); - // return this.http.delete(url, options).subscribe( - // return res; - // ); - this.http.delete(url, options).subscribe((res) => { + this.http.delete(url, {headers: headers, observe: 'response'}).subscribe((res) => { console.log('deleted'); }); } - private handleError(error: any) { + private handleError(error: HttpErrorResponse) { console.error('server error:', error); - if (error instanceof Response) { + if (error.error instanceof Error) { let errMessage = ''; - try { - errMessage = error.json(); - } catch (err) { - errMessage = error.statusText; + if (error.error.message && error.error.message !== '') + { + errMessage = error.error.message; + } + else + { + errMessage = error.status.toString(); } return Observable.throw(errMessage); } diff --git a/src/Web/WebSPA/Client/modules/shared/services/security.service.ts b/src/Web/WebSPA/Client/modules/shared/services/security.service.ts index 45007b5d1..d0fdcb68c 100644 --- a/src/Web/WebSPA/Client/modules/shared/services/security.service.ts +++ b/src/Web/WebSPA/Client/modules/shared/services/security.service.ts @@ -1,5 +1,5 @@ import { Injectable } from '@angular/core'; -import { Http, Response, Headers } from '@angular/http'; +import { HttpClient, HttpResponse, HttpHeaders } from '@angular/common/http'; import 'rxjs/add/operator/map'; import { Observable } from 'rxjs/Observable'; import { Subject } from 'rxjs/Subject'; @@ -12,16 +12,16 @@ import { StorageService } from './storage.service'; export class SecurityService { private actionUrl: string; - private headers: Headers; + private headers: HttpHeaders; private storage: StorageService; private authenticationSource = new Subject(); authenticationChallenge$ = this.authenticationSource.asObservable(); private authorityUrl = ''; - constructor(private _http: Http, private _router: Router, private route: ActivatedRoute, private _configurationService: ConfigurationService, private _storageService: StorageService) { - this.headers = new Headers(); - this.headers.append('Content-Type', 'application/json'); - this.headers.append('Accept', 'application/json'); + constructor(private _http: HttpClient, private _router: Router, private route: ActivatedRoute, private _configurationService: ConfigurationService, private _storageService: StorageService) { + this.headers = new HttpHeaders(); + this.headers = this.headers.set('Content-Type', 'application/json'); + this.headers = this.headers.set('Accept', 'application/json'); this.storage = _storageService; this._configurationService.settingsLoaded$.subscribe(x => { @@ -224,21 +224,20 @@ export class SecurityService { if (this.authorityUrl === '') this.authorityUrl = this.storage.retrieve('IdentityUrl'); - return this._http.get(this.authorityUrl + '/connect/userinfo', { + return this._http.get(this.authorityUrl + '/connect/userinfo', { headers: this.headers, - body: '' - }).map(res => res.json()); + }).map(res => res); } private setHeaders() { - this.headers = new Headers(); - this.headers.append('Content-Type', 'application/json'); - this.headers.append('Accept', 'application/json'); + this.headers = new HttpHeaders(); + this.headers = this.headers.set('Content-Type', 'application/json'); + this.headers = this.headers.set('Accept', 'application/json'); let token = this.GetToken(); if (token !== '') { - this.headers.append('Authorization', 'Bearer ' + token); + this.headers = this.headers.set('Authorization', 'Bearer ' + token); } } } \ No newline at end of file diff --git a/src/Web/WebSPA/Client/modules/shared/shared.module.ts b/src/Web/WebSPA/Client/modules/shared/shared.module.ts index da7667df6..2584b0c38 100644 --- a/src/Web/WebSPA/Client/modules/shared/shared.module.ts +++ b/src/Web/WebSPA/Client/modules/shared/shared.module.ts @@ -2,7 +2,8 @@ import { NgModule, ModuleWithProviders } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FormsModule, ReactiveFormsModule, FormBuilder } from '@angular/forms'; import { RouterModule } from '@angular/router'; -import { HttpModule, JsonpModule } from '@angular/http'; +import { JsonpModule } from '@angular/http'; +import { HttpClientModule } from '@angular/common/http'; import { NgbModule } from '@ng-bootstrap/ng-bootstrap'; // Services @@ -29,7 +30,7 @@ import { UppercasePipe } from './pipes/uppercase.pipe'; RouterModule, NgbModule.forRoot(), // No need to export as these modules don't expose any components/directive etc' - HttpModule, + HttpClientModule, JsonpModule ], declarations: [