Friday, 24 February 2023

Web What is Promise Object ? Fetch VS Axios

 


 

Promise

 

The Promise object represents the eventual completion (or failure) of an asynchronous operation and its resulting value.

 

 

Axios is a promise-based HTTP library that lets developers make requests to either their own or a third-party server to fetch data. It offers different ways of making requests such as GET, POST, PUT/PATCH, and DELETE.

 

Axios works by making HTTP requests with NodeJS and XMLHttpRequests on the browser. If the request was successful, you will receive a response with the data requested. If the request failed, you will get an error. You can also intercept the requests and responses and transform or modify them


 

 Axios

1)Axios is a third-party HTTP client library for making network requests.

 

2) It is is a promise-based HTTP client.

 

3)  Axios can be installed by using a CDN or package manager

 

       CDN: <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>

                             Or Install using NPM - npm install axios Or Install using Yarn - yarn add axios

4) Code:    axios.get('https://codilime.com/') .then(response => console.log(response.data));

 

5) By Default Stringify

Fetch

 

1) Fetch is a built-in API

 

2) Fetch, like Axios, is a promise-based HTTP client.

 

3) we don't have to install or import anything. It's available in all modern browsers,

 

 4) Code:    fetch('https://codilime.com/') .then(response => response.json()) .then(console.log);

 

5) Explicit Stringify

 

 

Code

Axios

axios(url, {

  // configuration options

})

 

 

axios(url, {
  method: 'post',
  timeout: 1000,
  headers: {
    "Content-Type": "application/json",
  },
  data: {
    property: "value",
  },
})

 

Fetch

fetch(url, {
  method: 'POST',
  headers: {
    "Content-Type": "application/json",
  },
  body: JSON.stringify({
    property: "value",
  }),
})

 

 

Reference: https://codilime.com/blog/axios-vs-fetch/#:~:text=Different%20properties%20are%20used%20for,API%20using%20the%20POST%20method

No comments:

Post a Comment