Problem setting API client authorization key in axios

my API is developed using Laravel, I am currently implementing authorization logic using Laravel Passport. the client application is a Vuejs application, Http calls are done using axios.

Passport is perfectly returning a token (i'm using client credentials type of grants). axios offers a way to set default headers by setting axios.defaults.headers.common array. Here is my axios call (implemented in bootstrap.js)

async function a() {
    var ret = "";
    await axios
        .post("/oauth/token", {
            "client_id": 7,
            "client_secret": "2GmvfxQev7AnUyfq0Srz4jJaMQyWSt1iVZtukRR6",
            "grant_type": "client_credentials",
            "scope": "*"
        })
        .then((resp) => {
            ret =  resp.data.access_token;
        })
    return ret; 
}
a().then((res) => {
    console.log(res) //this perfectly loggs the token to the console.
    axios.defaults.headers.common["Authorization"] = "Bearer " + res
})

However, all subsequent axios calls are missing the Bearer token header.

via Chebli Mohamed