fetch api request code example
Example 1: js fetch 'post' json
//Obj of data to send in future like a dummyDb
const data = { username: 'example' };
//POST request with body equal on data in JSON format
fetch('https://example.com/profile', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify(data),
})
.then((response) => response.json())
//Then with the data from the response in JSON...
.then((data) => {
console.log('Success:', data);
})
//Then with the error genereted...
.catch((error) => {
console.error('Error:', error);
});
// Yeah
Example 2: Add no cores to fetch
// There were no quick access to mode and credentials to other fetch answers.
// Data you'll be sending
const data = { funny: "Absolutely not", educational: "yas" }
fetch('https://example.com/api/', {
method: 'POST', // The method
mode: 'no-cors', // It can be no-cors, cors, same-origin
credentials: 'same-origin', // It can be include, same-origin, omit
headers: {
'Content-Type': 'application/json', // Your headers
},
body: JSON.stringify(data),
}).then(returnedData => {
// Do whatever with returnedData
}).catch(err => {
// In case it errors.
})
Example 3: javascript fetch api
fetch('http://example.com/movies.json')
.then((response) => {
return response.json();
})
.then((data) => {
console.log(data);
});
Example 4: fetch api javascript
fetch('http://example.com/movies.json')
.then((response) => {
return response.json();
})
.then((myJson) => {
console.log(myJson);
});
Example 5: http request javascript fetch
fetch('http://example.com/movies.json')
.then(response => response.json())
.then(data => console.log(data));
Example 6: fetch
var formData = new FormData();
var fileField = document.querySelector("input[type='file']");
formData.append('username', 'abc123');
formData.append('avatar', fileField.files[0]);
fetch('https://example.com/profile/avatar', {
method: 'PUT',
body: formData
})
.then(response => response.json())
.catch(error => console.error('Error:', error))
.then(response => console.log('Success:', response));