Demande POST avec l'API Fetch?

Je sais qu'avec la nouvelle Extraction de l'API (utilisé ici avec ES2017 de async/await), vous pouvez faire une requête comme ceci:

async getData() {
    try {
        let response = await fetch('https://example.com/api');
        let responseJson = await response.json();
        console.log(responseJson);
    } catch(error) {
        console.error(error);
    }
}

Mais comment voulez-vous faire une demande POST?

source d'informationauteur robertmylne

  1. 27

    Longue histoire courte, Chercher vous permet aussi de passer d'un objet pour un service personnalisé à la demande:

    fetch("http://example.com/api/endpoint/", {
  method: "post",
  headers: {
    'Accept': 'application/json',
    'Content-Type': 'application/json'
  },

  //make sure to serialize your JSON body
  body: JSON.stringify({
    name: myName,
    password: myPassword
  })
})
.then( (response) => { 
   //do something awesome that makes the world a better place
});

    Découvrez le chercher de la documentation pour encore plus de goodies et de pièges:

    https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch

    Veuillez noter que, puisque vous êtes en train de faire un async try/catch modèle, vous aurez juste omettre le then() fonction dans mon exemple);

  2. 5

    si vous voulez faire une simple requête post sans envoyer de données JSON.

    fetch("/url-to-post",
{
    method: "POST",

    //whatever data you want to post with a key-value pair

    body: "name=manas&age=20",
    headers: 
    {
        "Content-Type": "application/x-www-form-urlencoded"
    }

}).then((response) => 
{ 
    //do something awesome that makes the world a better place
});
  3. 0

    Utilisation https://github.com/axios/axios. et la méthode Post comme ceci:

    //Send a POST request
axios({
  method: 'post',
  url: '/user/12345',
  data: {
    firstName: 'Fred',
    lastName: 'Flintstone'
  }
});

    très facile à utiliser.