Proper Way to Make API Fetch 'POST' with Async/Await

actually your code can be improved like this:

to do a post just add the method on the settings of the fetch call.

getDevices = async () => {    const location = window.location.hostname;    const settings = {        method: 'POST',        headers: {            Accept: 'application/json',            'Content-Type': 'application/json',        }    };    try {        const fetchResponse = await fetch(`http://${location}:9000/api/sensors/`, settings);        const data = await fetchResponse.json();        return data;    } catch (e) {        return e;    }    }

Here is an example with configuration:

try {    const config = {        method: 'POST',        headers: {            'Accept': 'application/json',            'Content-Type': 'application/json',        },        body: JSON.stringify(data)    }    const response = await fetch(url, config)    //const json = await response.json()    if (response.ok) {        //return json        return response    } else {        //    }} catch (error) {        //}

2021 answer: just in case you land here looking for how to make GET and POST Fetch api requests using async/await or promises as compared to axios.

I'm using jsonplaceholder fake API to demonstrate:

Fetch api GET request using async/await:

         const asyncGetCall = async () => {            try {                const response = await fetch('https://jsonplaceholder.typicode.com/posts');                 const data = await response.json();                // enter you logic when the fetch is successful                 console.log(data);               } catch(error) {            // enter your logic for when there is an error (ex. error toast)                  console.log(error)                 }             }          asyncGetCall()

Fetch api POST request using async/await:

    const asyncPostCall = async () => {            try {                const response = await fetch('https://jsonplaceholder.typicode.com/posts', {                 method: 'POST',                 headers: {                   'Content-Type': 'application/json'                   },                   body: JSON.stringify({             // your expected POST request payload goes here                     title: "My post title",                     body: "My post content."                    })                 });                 const data = await response.json();              // enter you logic when the fetch is successful                 console.log(data);               } catch(error) {             // enter your logic for when there is an error (ex. error toast)                  console.log(error)                 }             }asyncPostCall()

GET request using Promises:

  fetch('https://jsonplaceholder.typicode.com/posts')  .then(res => res.json())  .then(data => {   // enter you logic when the fetch is successful    console.log(data)  })  .catch(error => {    // enter your logic for when there is an error (ex. error toast)   console.log(error)  })

POST request using Promises:

fetch('https://jsonplaceholder.typicode.com/posts', {  method: 'POST',  headers: {    'Content-Type': 'application/json',  },   body: JSON.stringify({     // your expected POST request payload goes here      title: "My post title",      body: "My post content."      })})  .then(res => res.json())  .then(data => {   // enter you logic when the fetch is successful    console.log(data)  })  .catch(error => {  // enter your logic for when there is an error (ex. error toast)   console.log(error)  })  

GET request using Axios:

        const axiosGetCall = async () => {            try {              const { data } = await axios.get('https://jsonplaceholder.typicode.com/posts')    // enter you logic when the fetch is successful              console.log(`data: `, data)                       } catch (error) {    // enter your logic for when there is an error (ex. error toast)              console.log(`error: `, error)            }          }        axiosGetCall()

POST request using Axios:

const axiosPostCall = async () => {    try {      const { data } = await axios.post('https://jsonplaceholder.typicode.com/posts',  {      // your expected POST request payload goes here      title: "My post title",      body: "My post content."      })   // enter you logic when the fetch is successful      console.log(`data: `, data)       } catch (error) {  // enter your logic for when there is an error (ex. error toast)      console.log(`error: `, error)    }  }axiosPostCall()