web-dev-qa-db-fra.com

Comment définir l'en-tête et les options dans axios?

J'utilise axios pour effectuer un post HTTP comme ceci:

 import axios from 'axios'
    params = {'HTTP_CONTENT_LANGUAGE': self.language}
    headers = {'header1': value}
    axios.post(url, params, headers)

Est-ce correct? Ou devrais-je faire:

axios.post(url, params: params, headers: headers)

vue.jsaxios
65
user2950593

Il y a plusieurs moyens de le faire:

  • Pour une seule demande:

    let config = {
  headers: {
    header1: value,
  }
}

let data = {
  'HTTP_CONTENT_LANGUAGE': self.language
}

axios.post(URL, data, config).then(...)

  • Pour définir la configuration globale par défaut:

    axios.defaults.headers.post['header1'] = 'value' // for POST requests
axios.defaults.headers.common['header1'] = 'value' // for all requests

  • Pour définir comme instance par défaut axios:

    let instance = axios.create({
  headers: {
    post: {        // can be common or any other method
      header1: 'value1'
    }
  }
})

//- or after instance has been created
instance.defaults.headers.post['header1'] = 'value'

//- or before a request is made
// using Interceptors
instance.interceptors.request.use(config => {
  config.headers.post['header1'] = 'value';
  return config;
});
138
riyaz-ali

Vous pouvez envoyer une requête get avec des en-têtes (pour l'authentification avec jwt par exemple):

axios.get('https://example.com/getSomething', {
 headers: {
   Authorization: 'Bearer ' + token //the token is a variable which holds the token
 }
})

Aussi, vous pouvez envoyer une demande de publication.

axios.post('https://example.com/postSomething', {
 email: varEmail, //varEmail is a variable which holds the email
 password: varPassword
},
{
  headers: {
    Authorization: 'Bearer ' + varToken
  }
})

Ma façon de le faire est de définir une requête comme celle-ci:

 axios({
  method: 'post', //you can set what request you want to be
  url: 'https://example.com/request',
  data: {id: varID},
  headers: {
    Authorization: 'Bearer ' + varToken
  }
})
59
roli roli

Vous pouvez passer un objet de configuration à axios comme:

axios({
  method: 'post',
  url: '....',
  params: {'HTTP_CONTENT_LANGUAGE': self.language},
  headers: {'header1': value}
})
15
sjc42002

Voici un exemple simple de configuration avec en-têtes et responseType:

var config = {
  headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
  responseType: 'blob'
};

axios.post('http://YOUR_URL', this.data, config)
  .then((response) => {
  console.log(response.data);
});

Content-Type peut être 'application/x-www-form-urlencoded' ou 'application/json' et peut également fonctionner avec 'application/json; charset = utf-8'

responseType peut être 'arraybuffer', 'blob', 'document', 'json', 'text', 'stream'

Dans cet exemple, this.data correspond aux données que vous souhaitez envoyer. Ce peut être une valeur ou un tableau. (Si vous voulez envoyer un objet, vous devrez probablement le sérialiser)

11
gtamborero

Vous pouvez initialiser un en-tête par défaut axios.defaults.headers

 axios.defaults.headers = {
        'Content-Type': 'application/json',
        Authorization: 'myspecialpassword'
    }

   axios.post('https://myapi.com', { data: "hello world" })
        .then(response => {
            console.log('Response', response.data)
        })
        .catch(e => {
            console.log('Error: ', e.response.data)
        })
5
Morris S

si vous voulez faire une requête get avec params et en-têtes.

var params = {
  paramName1: paramValue1,
  paramName2: paramValue2
}

var headers = {
  headerName1: headerValue1,
  headerName2: headerValue2
}

 Axios.get(url, {params, headers} ).then(res =>{
  console.log(res.data.representation);
});
1
Rishith Poloju