## Accelerators

### Go to Overview

KDP KDSP

PremonR Studio9

#### TechHub

Akka Scala Rust Spark Functional Java Kafka Flink ML/AI DevOps Data Warehouse

## Insights # How to make HTTP Requests Using Axios Library ## Introduction

Axios is a Javascript library used to perform HTTP requests for Nodejs and browsers. It supports the Promise API and makes it easy to send requests asynchronously. In this article, we will learn, how to make GET/POST/PUT/DELETE HTTP requests using Axios.

### Features

• Make HTTP requests from node.js
• Supports the Promise API
• Intercept request and response
• Transform request and response data
• Cancel requests
• Automatic transforms for JSON data

## Installation

We can install Axios in our project in one of the following ways:

npm command:

``\$ npm install axios``

yarn command:

``\$ yarn add axios``

using CDN:

``https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js``

In this article, we will use the npm command to install the Axios. For that, we need to require the Axios in the project

## Making Request using Axios

Syntax of Axios is given below.

``Syntax : axios(config)``

Now, in the given syntax what does this config consist of? To make the request we have to pass the relevant config to Axios. Only the URL is required and if we do not specify the method, it is by default considered as GET request. Request config consists of:

``````axios({
method:'method',
url: 'url',
baseURL: 'https://axios/api/',
data: {},
responseType: 'json',
}) ``````

Axios also provides a set of shorthand methods for performing different types of requests. The methods are as follows:

• axios.request(config)
• axios.delete(url[, config])
• axios.options(url[, config])
• axios.post(url[, data[, config]])
• axios.put(url[, data[, config]])
• axios.patch(url[, data[, config]])

## Axios Responce Object

When a request is sent to the server, it returns a response that contains an object having information as given below:

• data – the payload returned from the server
• status – the HTTP code returned from the server
• statusText – the HTTP status message returned by the server
• config – the original request configuration
• request – the request object

For example:

``````const axios  = require("axios");

function example(){
axios({
method :'get',
url : 'http://127.0.0.1:5500/data.json'
}).then(res=> {
console.log(res);
})
}
example();``````

As a result, we will get:

## Axios GET Request

To understand the get request, let’s assume that we have JSON data in data.json file same as shown below which we want to get and we have a main index.js file:

data.json file:

``````{
"id": 1,
"name": "Marry ",
"designation": "Software Consultant"

}``````

index.js file:

``````const axios  = require("axios");

function getFunction() {
config = {
method: 'get',
url: 'http://127.0.0.1:5500/data.json'
}

axios(config)
.then(res => {
console.log(res.data);
})
.catch(error => console.log(error));
}
getFunction();``````

or we can write the same code as:

``````const axios  = require("axios");

function getFunction() {
axios.get('http://127.0.0.1:5500/data.json')
.then(res => {
console.log(res.data);
})
.catch(error => console.log(error));
}
getFunction();``````

The above examples are using callbacks. Let’s understand how to write get request using async/await. An example is shown in the below image:

``````const axios  = require("axios");

async function getFunction() {
try {
const res = await axios.get('http://127.0.0.1:5500/data.json');
console.log(res.data);
} catch (error) {
console.log(error)
}
}
getFunction();``````

## Axios POST Request

Below is the example of a POST request using callbacks:

``````const axios = require("axios");

function postFunction() {
const config = {
method: 'POST',
data : { id: 2, name: 'Christina', designation: 'Software Consultant' }
};

axios.post('/data', config)
.then((res) => {
console.log(res.data);
})
.catch(error => console.log(error));
}

postFunction();``````

using Async/await:

``````const axios = require("axios");

async function postFunction() {
try{
const config = {
method: 'POST',
data : { id: 2, name: 'Christina', designation: 'Software Consultant' }
};
let res = await axios.post('/data', config);
console.log(res.data);
} catch (error) {
console.log(error)
}
}

postFunction();``````

## Axios PUT Request

Below is an example of a PUT request using callbacks. In this example, we are updating the data where id = 1.

``````const axios = require("axios");

function putFunction() {
const config = {
method: 'PUT',
data : { id: 1, name: 'Marry', designation: 'Sr. Software Consultant' }
};

axios.put('/data/1', config)
.then((res) => {
console.log(res.data);
})
.catch(error => console.log(error));
}

putFunction();``````

using async/await:

``````const axios = require("axios");

async function putFunction() {
try{
const config = {
method: 'PUT',
data : { id: 1, name: 'Marry', designation: 'Sr. Software Consultant' }
};
let res = await axios.put('/data/1', config);
console.log(res.data);
} catch (error) {
console.log(error)
}
}

putFunction();``````

## Axios Delete Request

An example is given below to delete specific data and as a result, it will delete the data having id =1.

``````const axios = require("axios");

function deleteFunction() {
axios.delete('/data/1', config)
.then((res) => {
console.log(res.data);
})
.catch(error => console.log(error));
}

deleteFunction();``````

## Conclusion

So with this blog, hope I was able to explain how we can make basic HTTP requests ( get, post, put and delete ) using Axios. Thank you for reading and if you really like the blog hit the like button, and to learn more, Visit here
{"ft_lang_label":"__label__en","ft_lang_prob":0.60549605,"math_prob":0.6258458,"size":5643,"snap":"2022-40-2023-06","text_gpt3_token_len":1346,"char_repetition_ratio":0.15907076,"word_repetition_ratio":0.18091698,"special_character_ratio":0.28406876,"punctuation_ratio":0.23413762,"nsfw_num_words":0,"has_unicode_error":false,"math_prob_llama3":0.9556153,"pos_list":[0,1,2,3,4],"im_url_duplicate_count":[null,null,null,2,null],"WARC_HEADER":"{\"WARC-Type\":\"response\",\"WARC-Date\":\"2023-02-04T16:08:24Z\",\"WARC-Record-ID\":\"<urn:uuid:af249f7f-5150-4f89-9563-876624a49e6b>\",\"Content-Length\":\"253881\",\"Content-Type\":\"application/http; msgtype=response\",\"WARC-Warcinfo-ID\":\"<urn:uuid:22e124bc-3c78-40ae-ae0f-0749d33d0161>\",\"WARC-Concurrent-To\":\"<urn:uuid:f1eac333-8a54-438f-b0c1-b6fc0f24caf8>\",\"WARC-IP-Address\":\"192.0.78.230\",\"WARC-Target-URI\":\"https://blog.knoldus.com/how-to-make-http-requests-using-axios-library/\",\"WARC-Payload-Digest\":\"sha1:UC2MCGURZ4S3YEUN4F35RSJKWBJSLBIL\",\"WARC-Block-Digest\":\"sha1:HDUG5XCWOCNSJYTNOH3VGGFHVUGLYUPU\",\"WARC-Identified-Payload-Type\":\"text/html\",\"warc_filename\":\"/cc_download/warc_2023/CC-MAIN-2023-06/CC-MAIN-2023-06_segments_1674764500140.36_warc_CC-MAIN-20230204142302-20230204172302-00088.warc.gz\"}"}