How add meta element in HTTP header via req.clone in Angular

Question

Currently I am cloning request to add some parameter like this:

    const modifiedReq = req.clone(
      { 
        params: new HttpParams().set('MYPARAM', MyParamValue),
      })

Now, to the same request I want to add this in header section:

<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">

How can I add this?

Update:

I am aware of setting header just like this example:

request = request.clone({
setHeaders: 
{
    Authorization: `Bearer ${token}`
}
});

This way 'Content-Type' etc can be set. But in my example above, there is something meta is set inside which there are paremeters http-equiv and content which I don't know how to set.

(Additional info: This I am adding in header to allow to mix secure & non-secure requests)

Does this answer your question? How I add Headers to http.get or http.post in Typescript and angular 2? — karoluS
– karoluS, Commented Sep 6, 2022 at 7:32
@karoluS Not exactly because how to add header sections 'Content-Type' etc described there however in this case meta data is added inside which there are sections like http-equiv etc are there this is bit confusing to me. — Atul
– Atul, Commented Sep 6, 2022 at 7:36
If I understand you correctly. http-equiv is just an attribute that allow us frontend developers to emulate HTTP headers. If you want to have this sent as part of the request, you do not need to add it to the header. What matters is value of http-equiv and value of content. Here's a bit of documentation that might shed some light: developer.mozilla.org/en-US/docs/Web/HTML/Element/meta — karoluS
– karoluS, Commented Sep 6, 2022 at 7:40
@karoluS I am coming from this answer where he tells what to sent to server in header, but juts not sure how can that be sent via req.clone in Angluar — Atul
– Atul, Commented Sep 6, 2022 at 7:50

JakaRanga · Accepted Answer · 2022-09-06 07:35:00Z

0

The clone method allows you to pass new or modified headers.

Try this code:

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

import {environment} from '../../../../environments/environment';

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

    const headers = new HttpHeaders({
      'Authorization': 'token 123',
      'WEB-API-key': environment.webApiKey,
      'Content-Type': 'application/json'
    });


    const cloneReq = req.clone({headers});

    return next.handle(cloneReq);
  }
}

Piece of code taken from this thread : Interceptor Angular 4.3 - Set multiple headers on the cloned request

answered Sep 6, 2022 at 7:35

JakaRanga

162 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Atul Over a year ago

How to set meta and then http-equiv & `content' in header?

Collectives™ on Stack Overflow

How add meta element in HTTP header via req.clone in Angular

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related