Why Choose Axios Over jQuery? A Complete Guide to HTTP Requests in JavaScript

Axios is a promise‑based HTTP client that works in browsers and in Node.js, providing a unified API for XMLHttpRequests and Node’s http module.

Compared with jQuery’s $.get/$.post, Axios offers several advantages: (1) it supports Node.js, (2) it follows the standard Promise syntax (jQuery only fully supports it from version 3.0), and (3) it is lightweight and focused solely on HTTP, making it a better fit when you don’t need jQuery’s full feature set.

Basic usage

GET

axios.get('https://api.github.com/users/' + username)
  .then(function (response) {
    console.log(response.data);
    console.log(response.status);
  });

POST

axios.post('/save', { firstName: 'Marlon', lastName: 'Bernardes' })
  .then(function (response) {
    console.log('saved successfully');
  })
  .catch(function (error) {
    console.log(error);
  });

Axios also supports DELETE, HEAD, PUT, PATCH, and other HTTP methods.

Executing multiple requests

axios.all([
  axios.get('https://api.github.com/xxx/1'),
  axios.get('https://api.github.com/xxx/2')
])
.then(axios.spread(function (userResp, reposResp) {
  // Both requests have completed
  console.log('User', userResp.data);
  console.log('Repositories', reposResp.data);
}));

When all requests finish, the callback receives an array of responses in the same order as the requests; axios.spread can split them into separate arguments.

Custom headers

var config = {
  headers: { 'X-My-Custom-Header': 'Header-Value' }
};

axios.get('https://api.github.com/users/xxx', config);
axios.post('/save', { firstName: 'Marlon' }, config);

Interceptors

You can intercept requests or responses before they reach .then or .catch.

// Add interceptor
var myInterceptor = axios.interceptors.request.use(function (config) {
  // modify config
  return config;
});

// Remove interceptor
axios.interceptors.request.eject(myInterceptor);

Installation

Using npm: npm install axios Using Bower: bower install axios Or download manually from the GitHub distribution folder.

Running in Node and browsers

Node:

var axios = require('axios');
axios.get('https://api.github.com/users/xxx');

Browser (include script):

<script src="./bower_components/axios/dist/axios.js"></script>
<script>
  axios.get('https://api.github.com/xxx');
</script>

Project repository: https://github.com/mzabriskie/axios