Angular 5 Header value is not append correctly

Question

I am appending the headers in angular service request but the value is not appending correctly, I was created one Interceptor to add header like below

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


    // Clone the request to add the new header
    const clonedRequest = req.clone({ headers: req.headers.set('tenantId', 'r 123') });

    // Pass the cloned request instead of the original request to the next handle
    return next.handle(clonedRequest);
  }
}

While i am sending to server the value not appending correctly, it's showin like in below picture, the value 'r 123' is not appending, How do i solve it?

headers image

can you confirm first your interceptor is called or not ?? if called then try to remove space here 'r 123' between r and digits and then try — Nirali, Apr 01 '19 at 06:53
req.clone({ headers: req.headers.set('tenantId', 'r 123') }) is also correct — Tanmay_vijay, Apr 01 '19 at 06:58
The request is a [CORS pre-flight OPTIONS request](https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS#Preflighted_requests). The server needs to respond with the appropriate [CORS](https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS) headers. — georgeawg, Apr 01 '19 at 07:01
@georgeawg yes, it;s preflighted request how do i solve this problem — Raja Ram, Apr 01 '19 at 07:34

score 0 · Answer 1 · answered Apr 01 '19 at 06:56

0

Have you added AddHeaderInterceptor in you app.module.ts.

// ...
providers: [
    // ...
    { provide: HTTP_INTERCEPTORS, useClass: AddHeaderInterceptor, multi: true },
    //...
]

answered Apr 01 '19 at 06:56

Tanmay_vijay

569
3
12

i already added this, But its not working – Raja Ram Apr 01 '19 at 07:09

score 0 · Answer 2 · answered Apr 01 '19 at 06:57

0

You can try these

const httpOptions = {
  headers: new HttpHeaders({
  'header1':  'test',
  'header2': 'test',
 })
};
req.clone({ headers: httpOptions) });

answered Apr 01 '19 at 06:57

Bhagwat Tupe

1,905
1
13
28

Thanks for your answer, Still getting same error. – Raja Ram Apr 01 '19 at 07:10
which error you got? – Bhagwat Tupe Apr 01 '19 at 07:13
he bro, header is not show option method (these method is preflight request ) when these request is success then again hit another request get or post yiu can check header in these request – Bhagwat Tupe Apr 01 '19 at 07:16
Can you send me the example of preflight request, How to handle it? – Raja Ram Apr 01 '19 at 07:41
backend server set CORS origin header that accept all types of request. – Bhagwat Tupe Apr 01 '19 at 07:59

score 0 · Answer 3 · answered Apr 01 '19 at 07:01

0

try this for angular 5,this might work,

    const clonedRequest = req.clone({
        setHeaders: { 'tenantId', 'r 123'}  
    });

answered Apr 01 '19 at 07:01

Nirali

454
1
6
16

I changed, Still getting same issue. – Raja Ram Apr 01 '19 at 07:10
ok did you check first your interceptor method is called or not ??try to put console.log('something') inside interceptor method and confirm this. – Nirali Apr 01 '19 at 07:11
Yes, it's printing, But still not appending the value, and I removed the space in string also. – Raja Ram Apr 01 '19 at 07:33

Angular 5 Header value is not append correctly

3 Answers3