2017-08-17 15 views
17

Tüm http istekleri için temel API URL'sini ayarlamak üzere documentation yolunda bir yol bulamadım. Açısal HttpClient ile yapmak mümkün mü?Açısal HttpClient için baseUrl nasıl ayarlanır?

+2

Sen https://angular.io/api/common/http (bir [önleme] yaratabilir/HttpInterceptor) url'yi istediğiniz herhangi bir temel ile güncelleyecektir. –

+0

Bu vaka için interceptors kullanmak bir yük değil mi? –

+0

Sadece bu evet değiştirmek isterseniz, olabilir. Başka bir seçenek de, temel yolun eklenmesi gibi gerekli tüm dönüşümleri yapacak basit bir getApiUrl() işlevine sahip olmaktır. –

cevap

0

Bunu yapmak için varsayılan bir yol olmadığını düşünüyorum. HttpService ve içinde varsayılan URL'nizin özelliğini tanımlayabilir ve mülk URL'nizle http.get ve başkalarını aramanın yöntemlerini yapabilirsiniz. Sonra, HttpClient

+0

Http hizmeti için yaptım, ama HttpClient biraz daha akıllı –

25

yerine HttpService'yi enjekte edin. Yeni HttpClient Interceptor kullanın. istediğiniz gibi HttpInterceptor isteği klonlamak ve değiştirebilirsiniz

import {Injectable} from '@angular/core'; 
import {HttpEvent, HttpInterceptor, HttpHandler, HttpRequest} from '@angular/common/http'; 
import {Observable} from 'rxjs/Observable'; 

@Injectable() 
export class APIInterceptor implements HttpInterceptor { 
    intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> { 

    const apiReq = req.clone({ url: `your-api-url/${req.url}` }); 
    return next.handle(apiReq); 
    } 
} 

, ben http isteklerinin tümü için varsayılan bir yolunu tanımlanan bu durumda:

HttpInterceptor uygulayan uygun bir enjektabl oluşturun.

aşağıdaki konfigürasyonlar ile HttpClientModule sağlayın: mutlaka bir temel URL gerekmez Şimdi

providers: [{ 
     provide: HTTP_INTERCEPTORS, 
     useClass: APIInterceptor, 
     multi: true, 
    } 
    ] 

tüm istekleri your-api-url/

+0

olduğunu umuyoruz Bu harika! Bir şey olsa da, burada Enjekte edilebilir dekoratör kullanmanıza gerek yoktur, sadece bir şey dekore edilmiş sınıf içine bir şey enjekte istediğinizde gereklidir. – BroiSatse

0

ile başlayacak HttpClient, Dokümanlar sadece isteğin api bölümünü belirtmeniz gerektiğini söylüyor, aynı sunucuya çağrı yapıyorsanız şu şekilde basittir:

this.http.get('/api/items').subscribe(data => { ...

Ancak, gerek ya, temel bir URL belirtmek istediğiniz eğer.

:

Bunu yapmak için 2 öneri var. Statik sınıf özelliği olan bir yardımcı sınıf.

export class HttpClientHelper{ 

    static baseURL: string = 'http://localhost:8080/myApp'; 
} 


this.http.get(`${HttpClientHelper.baseURL}/api/items`);//in your service class 

. Bir sınıf özelliği olan bir taban sınıfı yüzden herhangi yeni hizmet uzatın olmalıdır:

export class BackendBaseService { 

    baseURL: string = 'http://localhost:8080/myApp'; 

    constructor(){} 

}

@Injectable() 
export class ItemsService extends BackendBaseService{ 

    constructor(private http: HttpClient){ 
    super(); 
    } 

    public listAll(): Observable<any>{  
    return this.http.get(`${this.baseURL}/api/items`); 
    } 

}