vue.jsnuxt.jsvuejs3nuxt3.jsnuxt-auth

Supplying Authorization Header


How to supply the "Authorization: Bearer xxxxx" header in Vueform?

That is, how to extend this line to include the authorization header?

<Vueform endpoint="https://xxxxx.xx/xxxxx" method="post">

Solution

  • Vueform uses axios to send requests. All configuration options in the axios documentation can be applied in vueform.config.js, including headers:

    // vueform.config.js
    
    export default {
      axios: {
        headers: { Authorization: `Bearer ${token}` }
      },
      // ...
    }
    

    You can also provide an existing pre-configured axios instance if you have one, as seen in the Vueform documentation

    // vueform.config.js
    import axios from 'axios'
    
    axios.defaults.headers.common = { 'Authorization': `Bearer ${token}` }
    
    export default {
      axios,
      // ...
    }