Is it possible to change the axios config without reloading the script?

Question

Layout

I hang the token in the headers of all requests, if there is one in the local store.

const user = JSON.parse(window.localStorage.getItem('user')) || false

if (user)
{
  if (user.token)
  {
    config.headers = {
      'token': JSON.stringify(user.token)
    }
  }
}

Now we have to directly call a page reload after login to re-initialize axios with a token. Slightly degrades the user experience. Surely there is a way to hang headings differently.
While writing, the idea came to simply check the presence of a token in each request and assign a header, but will this be a good practice? Read local storage on EVERY request

Answer 1

it's your focus on the top slider that works.
add in fancybox options backFocus: false

Answer 2

Error in JS.
And then when you click on the "link" it draws # to the url, and thus throws it to the top.

Answer 3

it is not clear: at what point it is required to change the token, and to what.
Of course, you can reconfigure axios at any time. It takes the settings in this order :
You did not provide the code where you substitute token in the axios parameters. Let's say something global:
Similarly, later, when you need to change the token, do something like this:

axios.defaults.headers.common['Authorization'] = NEW_TOKEN;

and forward, you can make requests with a new token

axios.get('https://google.com').then(r => console.log(r));