How to add a global authorization header on nuxt.config.js?

tried

  axios: {
    defaults : {
      headers : {
        mon: [
          {
            'Authorization' : '5fb9c42ceba425fb9c42ceba43'
          }
        ]
      }
    }
  },

but not working

I can do

this.$axios.setHeader('Authorization', this.$store.state.appstore.akey);

but I find it not ideal when having multiple axios request because I have to add it on every request

How to add a global authorization header on nuxt.config.js?

tried

  axios: {
    defaults : {
      headers : {
        mon: [
          {
            'Authorization' : '5fb9c42ceba425fb9c42ceba43'
          }
        ]
      }
    }
  },

but not working

I can do

this.$axios.setHeader('Authorization', this.$store.state.appstore.akey);

but I find it not ideal when having multiple axios request because I have to add it on every request

• javascript
• vue.js
• axios
• nuxt.js

Share Improve this question Follow asked Nov 22, 2020 at 4:52 Juliver GalletoJuliver Galleto 9,0572727 gold badges9292 silver badges169169 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 3

Try this, taken from the module docs.

axios: {
  headers : {
    mon: {
      'Authorization' : '5fb9c42ceba425fb9c42ceba43'
    }
  }
}

I have created an plugin for it. Goto plugins and create axios.js:

export default function ({ $axios, store }) {
  if (process.client) {
    $axios.setToken(store.state.appstore.akey, 'Bearer')
  }
}

Then register your plugin in nuxt.config.js

plugins: ['@/plugins/axios'],