2017-08-04 16 views
11

(संपादक: वी.एस. संहिता, टाइपप्रति: 2.2.1)कोणीय 4.3.3 एचटीपी क्लाइंट: प्रतिक्रिया के शीर्षलेख से मूल्य कैसे प्राप्त करें?

उद्देश्य एक सेवा

import { 
    Injectable 
} from "@angular/core"; 

import { 
    HttpClient, 
    HttpHeaders, 
} from "@angular/common/http"; 

@Injectable() 
export class MyHttpClientService { 
    const url = 'url'; 

    const body = { 
     body: 'the body' 
    }; 

    const headers = 'headers made with HttpHeaders'; 

    const options = { 
     headers: headers, 
     observe: "response", // to display the full response 
     responseType: "json" 
    }; 

    return this.http.post(sessionUrl, body, options) 
     .subscribe(response => { 
      console.log(response); 
      return response; 
     }, err => { 
      throw err; 
     }); 
} 
में HttpClient के साथ एक पोस्ट अनुरोध मान लें अनुरोध

की प्रतिक्रिया के हेडर प्राप्त करने के लिए है

'Argument of type '{ 
    headers: HttpHeaders; 
    observe: string; 
    responseType: string; 
}' is not assignable to parameter of type'{ 
    headers?: HttpHeaders; 
    observe?: "body"; 
    params?: HttpParams; reportProgress?: boolean; 
    respons...'. 

Types of property 'observe' are incompatible. 
Type 'string' is not assignable to type '"body"'.' 
at: '51,49' source: 'ts' 
:

HttpClient Angular Documentation

पहली समस्या मैं एक टाइपप्रति त्रुटि है है

दरअसल, जब मैं) पोस्ट के रेफरी (विधि में जाओ, मैं इस प्रोटोटाइप पर बात (मैं उपयोग वी.एस. कोड)

post(url: string, body: any | null, options: { 
     headers?: HttpHeaders; 
     observe?: 'body'; 
     params?: HttpParams; 
     reportProgress?: boolean; 
     responseType: 'arraybuffer'; 
     withCredentials?: boolean; 
    }): Observable<ArrayBuffer>; 

लेकिन मैं इस अतिभारित विधि हैं:

post(url: string, body: any | null, options: { 
    headers?: HttpHeaders; 
    observe: 'response'; 
    params?: HttpParams; 
    reportProgress?: boolean; 
    responseType?: 'json'; 
    withCredentials?: boolean; 
}): Observable<HttpResponse<Object>>; 

तो , मैंने इस त्रुटि को इस संरचना के साथ ठीक करने का प्रयास किया:

const options = { 
      headers: headers, 
      "observe?": "response", 
      "responseType?": "json", 
     }; 

और यह संकलित करता है! लेकिन मुझे सिर्फ जेसन प्रारूप में बॉडी अनुरोध मिलता है।

फ़्यूथरमोर, मुझे क्यों रखना है? खेतों के कुछ नाम के अंत में प्रतीक? जैसा कि मैंने टाइपस्क्रिप्ट साइट पर देखा है, यह प्रतीक सिर्फ उपयोगकर्ता को बताएगा कि यह वैकल्पिक है?

मैंने बिना सभी क्षेत्रों के सभी क्षेत्रों का उपयोग करने की भी कोशिश की? निशान

संपादित

मैं समाधान Angular 4 get headers from API response द्वारा प्रस्तावित की कोशिश की। नक्शा समाधान के लिए:

this.http.post(url).map(resp => console.log(resp)); 

टाइपप्रति संकलक बताता है कि नक्शा मौजूद नहीं है, क्योंकि यह प्रत्यक्ष

का एक हिस्सा मैं भी करने की कोशिश की नहीं है इस

import { Response } from "@angular/http"; 

this.http.post(url).post((resp: Response) => resp) 

यह कम्पाइल, लेकिन मैं एक मिल असमर्थित मीडिया प्रकार प्रतिक्रिया। इन समाधानों को "Http" के लिए काम करना चाहिए, लेकिन यह "HttpClient" पर नहीं है।

संपादित 2

मैं भी @Supamiu समाधान के साथ एक असमर्थित मीडिया प्रकार मिलता है, तो यह मेरे हेडर पर एक त्रुटि हो जाएगा। तो ऊपर से दूसरा समाधान (प्रतिक्रिया प्रकार के साथ) भी काम करना चाहिए। लेकिन personnaly, मुझे नहीं लगता कि इसके साथ मिश्रण करने "http" एक अच्छा तरीका है "HttpClient" इसलिए मैं Supamiu

का समाधान रखेंगे
+0

संभावित डुप्लिकेट https://stackoverflow.com/questions/44292270/angular- सीधे कच्चे में विकल्प डाल करने के लिए था 4-get-headers-from-api-response) – Hitmands

+1

@ हिटमैंड्स मैंने पहले से ही यह धागा देखा है, हालांकि यह "एचटीपी" और "एचटीपी क्लाइंट" का उपयोग नहीं करता है, और कोणीय 4.3.3 अब HttpClient का उपयोग करने के लिए प्रतीत होता है –

उत्तर

32

आप केवल सामग्री के बजाय पूर्ण प्रतिक्रिया का निरीक्षण कर सकते हैं:

http 
    .get<MyJsonData>('/data.json', {observe: 'response'}) 
    .subscribe(resp => { 
    // Here, resp is of type HttpResponse<MyJsonData>. 
    // You can inspect its headers: 
    console.log(resp.headers.get('X-Custom-Header')); 
    // And access the body directly, which is typed as MyJsonData as requested. 
    console.log(resp.body.someField); 
    }); 

देखें HttpClient's documentation

+0

धन्यवाद! मुझे असमर्थित डेटा प्रकार मिलता है लेकिन यह मेरे शीर्षलेखों पर एक गलती होगी –

+0

क्या किसी को यह पता है कि http.patch() के लिए ऐसा कैसे करना है? यह मेरे लिए काम नहीं करता है। प्रतिक्रिया खाली है, जब मैं एक स्थिति कोड के साथ कच्चे प्रतिक्रिया वस्तु चाहते हैं। – chriszichrisz

+0

ठीक है, मैंने अभी पाया है: यह http.patch (यूआरएल, पैराम्स, {निरीक्षण: 'प्रतिक्रिया'} है) और सुनिश्चित करें कि प्रतिक्रिया ऑब्जेक्ट प्रकार है HttpResponse chriszichrisz

7

दरअसल, मुख्य समस्या एक टाइपप्रति समस्या थी।

पोस्ट() के कोड में, विकल्पों को सीधे "पैरामीटर" इंटरफेस के रूप में पैरामीटर में घोषित किया गया था।

समाधान पैरामीटर के अंदर

http.post("url", body, {headers: headers, observe: "response"}).subscribe... 
[एपीआई प्रतिक्रिया से कोणीय 4 प्राप्त हेडर] (की
+0

जीवन बचतकर्ता - यह मुझे पागल कर रहा था। अभी भी नहीं मिलता है कि विकल्प हैश काम क्यों रेखांकित करते हैं लेकिन पोस्ट ("यूआरएल", बॉडी, विकल्प) नहीं है। लेकिन हाँ! – Gishu

संबंधित मुद्दे