कोणीय 4 httpclient csrf x-xsrf-token

Question

कोणीय दस्तावेज़ में नहीं भेजता है, यह उल्लेख किया गया है कि कोणीय httpclient स्वचालित रूप से पोस्ट अनुरोध के शीर्ष X-XSRF-TOKEN में कुकी XSRF-TOKEN का मान भेज देगा। Documentation link

लेकिन यह मेरे लिए हेडर नहीं भेजता है। यहाँ मेरी कोड

NodeJS कुकी

router.get('/set-csrf',function(req,res,next){ 
    res.setHeader('Set-Cookie', "XSRF-TOKEN=abc;Path=/; HttpOnly; SameSite=Strict");  
    res.send(); 
    }) 

स्थापित करने के लिए कोड मैं app.module.ts में httpclient का इस्तेमाल किया है है

imports: [ 
    HttpClientModule 
] 

** उपरोक्त कोड सिर्फ डिबग के लिए है उद्देश्य। मेरे पास सेट-सीएसआरएफ एंडपॉइंट नहीं है।

लेकिन जब मैं कोई पोस्ट अनुरोध भेजता हूं तो यह कोई हेडर नहीं भेजता है। मैं डीबग करने में सक्षम नहीं हूँ।

मैंने इस समस्या को कोणीय के गीथब भंडार में भी जोड़ा है। HttpXsrfInterceptor जांचता है कि अनुरोध GET या HEAD है, या यदि यह http से शुरू होता है। यदि सही है, तो यह हेडर जोड़ना छोड़ देता है।

यहाँ HttpXsrfInterceptor class

intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> { 
    const lcUrl = req.url.toLowerCase(); 
    // Skip both non-mutating requests and absolute URLs. 
    // Non-mutating requests don't require a token, and absolute URLs require special handling 
    // anyway as the cookie set 
    // on our origin is not the same as the token expected by another origin. 
    if (req.method === 'GET' || req.method === 'HEAD' || lcUrl.startsWith('http://') || 
     lcUrl.startsWith('https://')) { 
     return next.handle(req); 
    } 
    const token = this.tokenService.getToken(); 

    // Be careful not to overwrite an existing header of the same name. 
    if (token !== null && !req.headers.has(this.headerName)) { 
     req = req.clone({headers: req.headers.set(this.headerName, token)}); 
    } 
    return next.handle(req); 
    } 

में कोड मुझे यकीन है कि क्यों वे http/s भाग के लिए छोड़ दिया है नहीं कर रहा हूँ है। यहां मेरा issue in github

Answer 1

जो आप खोज रहे हैं HttpClientXsrfModule है।

कृपया इसके बारे में यहां और पढ़ें: https://angular.io/api/common/http/HttpClientXsrfModule।

आपके उपयोग इस तरह होना चाहिए:

imports: [ 
HttpClientModule, 
HttpClientXsrfModule.withConfig({ 
    cookieName: 'My-Xsrf-Cookie', // this is optional 
    headerName: 'My-Xsrf-Header' // this is optional 
}) 
] 

साथ ही, यदि आपके कोड निरपेक्ष URL के माध्यम से एपीआई लक्षित करता है, डिफ़ॉल्ट CSRF इंटरसेप्टर बॉक्स से बाहर काम नहीं करेगा। इसके बजाय आपको अपना खुद का इंटरसेप्टर लागू करना होगा जो पूर्ण मार्गों को अनदेखा नहीं करता है।

@Injectable() 
export class HttpXsrfInterceptor implements HttpInterceptor { 

    constructor(private tokenExtractor: HttpXsrfTokenExtractor) { 
    } 

    intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> { 
    const headerName = 'X-XSRF-TOKEN'; 
    let token = this.tokenExtractor.getToken() as string; 
    if (token !== null && !req.headers.has(headerName)) { 
     req = req.clone({ headers: req.headers.set(headerName, token) }); 
    } 
    return next.handle(req); 
    } 
} 

और अंत में अपने प्रदाताओं में जोड़ें:

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

Answer 2

मुझे लगता है सही विधि withOptions है। मैंने कॉनफिग के साथ उपयोग किया और त्रुटि मिली Property 'withConfig' does not exist on type 'typeof HttpClientXsrfModule'. यह प्रलेखन में एक टाइपिंग समस्या है। आपको HttpClientXsrfModule.withOptions({ cookieName: 'My-Xsrf-Cookie', headerName: 'My-Xsrf-Header', })