How to set default header in axios with Typescript

user_11013730 0
Viewed 7611

I want to set default header with axios in Typescript. Here is my function:

function setJwt(jwt: string | null) {axios.defaults.headers!.common["x-auth-token"] = jwt;}

This shows the following issue: enter image description here

How to solve that in Typescript?

axios typescript node.js
3 Answers

I've fixed this by extending HeadersDefaults interface from axios.

 import axios, { HeadersDefaults } from 'axios' 

 interface CommonHeaderProperties extends HeadersDefaults {
   Authorization: string;
 }

 axiosInstance.defaults.headers = {
   Authorization: `Bearer authToken`
 } as CommonHeaderProperties;
user_77708140

I succeed to solve the problem. Well, headers property has a Record<string, string> type.

So, we should change the second generic type like this:

enter image description here

We cast to unknown first because we can't reconvert directy the type Record

user_110137300

You can try like below,

function setJwt(jwt: string | null) {

    if (axios.defaults?.headers && axios.defaults.headers.common) {
        axios.defaults.headers.common['x-auth-token'] = jwt;
    }

}
user_66764100
Related