Sitemap

What is header in Angular Api request ? Basic Interview Question

2 min readMay 13, 2025

Whenever we send request, every request have header, which can see in network tab.

for sending extra information like authoritation and request related we need to set the header

To set header in angular we have options then child object headers to give additional information to server.

httpClientService.get('https:myserver/images/profile.jpg', 
{responseType: 'arraybuffer',
params: {filter: 'all'},
headers: {
'content-type': 'text',
},
reportProgress: true,
observe: 'events',

}
).subscribe(bufferData => {
console.log( bufferData.byteLength );
})

Like in above example he need to download file with progress also track so we doing the same.

  • Headers are key-value pairs objects pattern added to the request to provide additional information such as:
  • Authorization (e.g., Bearer tokens)
  • Content-Type (e.g., application/json)
  • Custom headers (e.g., X-Custom-Header)
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { Injectable } from '@angular/core';

@Injectable({
providedIn: 'root'
})
export class ApiService {
constructor(private http: HttpClient) {}

getData() {
const headers = new HttpHeaders({
'Authorization': 'Bearer your-token-here',
'Content-Type': 'application/json',
'X-Custom-Header': 'custom-value'
});

return this.http.get('https://api.yourapps.com/data', { headers });
}
}

--

--

Anil Kumar
Anil Kumar

Written by Anil Kumar

Software Engineer| Angular Advocate | Cyclist

No responses yet