Angular : comment faire si HttpClient ne renvoie pas d'en-tête (header) ?

Dans le framework Angular, on utilise un module pour gérer les requêtes HTTP vers des API ou des sites externes. Il s'agit du module "HttpClientModule" pour les versions 4 et ultérieures du framework et du module "HttpModule" pour les versions antérieures. La gestion des entêtes se fait à l'aide de la classe "HttpHeaders". Si vous ne parvenez pas à envoyer des entêtes, vous devez relire votre code car cette classe est particulière : elle est immuable.

Un objet immuable ne peut pas changer d'état au cours de son existence. Il possède donc un fonctionnement particulier par rapport à d'autres objets. Les méthodes "set()" et "append()" retournent une nouvelle instance de l'objet à chaque utilisation. Le fonctionnement diffère donc d'un objet classique.

let entetes = new HttpHeaders();
#L'écriture suivante ne fonctionne pas car l'objet ne changera pas
entetes.set('Accept-Encoding', 'gzip, deflate, sdch');
#Voici l'écriture correcte, il faut retourner l'objet dans une variable pour obtenir un header
entetes = entetes.set('Accept-Encoding', 'gzip, deflate, sdch');

Pour ajouter plusieurs paramètres, il existe plusieurs solutions. Vous pouvez enchaîner les méthodes les unes à la suite des autres. Pour pouvez également indiquer en paramètre une map qui contient plusieurs en-têtes.

#Ajout avec un enchaînement de méthodes
entetes = entetes.set('Accept-Encoding', 'gzip, deflate, sdch').set('monDeuxiemeEntete', 'maValeur');
#Ajout avec une map
entetes = entetes.set({'Accept-Encoding': 'gzip, deflate, sdch', 'monDeuxiemeEntete': 'maValeur'});
Les paramètres d'une requête HTTP, qui sont gérés par la classe "HttpParams", fonctionnent exactement de la même manière.

Depuis la version 5 du framework, il n'est plus nécessaire d'instancier un objet de la classe "HttpHeaders" pour transmettre des paramètres à la requête. Les méthodes d'envoi acceptent directement une map en paramètre. C'est la même chose pour les paramètres.

http.get('urlDeLapi',{headers: {'entete1':'valeur1','entete2':'valeur2'}, params: {'param1':'valeur3', 'param2':'valeur4'}});

AngularJS