Introduction
Axios is a promise-based HTTP client that works both in the browser and in a node.js environment. It basically provides a single API for dealing with
XMLHttpRequest
s and node’s http
interface. Besides that, it wraps the requests using a polyfill for ES6 new’s promise syntax. In this post we’ll see how to perform HTTP requests using axios. Looks promising, right? Let’s go!Installation
Before using axios, you first need to install it. There are several ways of doing so:
1) Using npm:
$ npm install axios
2) Using bower:
$ bower install axios
3) Manual download:
https://github.com/mzabriskie/axios/tree/master/dist
https://github.com/mzabriskie/axios/tree/master/dist
First steps
After installing, performing requests becomes trivial. In this example, we’ll be performing requests to GitHub’s API.
// Performing a GET request
axios.get('https://api.github.com/users/' + username)
.then(function(response){
console.log(response.data); // ex.: { user: 'Your User'}
console.log(response.status); // ex.: 200
});
// Performing a POST request
axios.post('/save', { firstName: 'Marlon', lastName: 'Bernardes' })
.then(function(response){
console.log('saved successfully')
});
Besides
post
and get
, there are also methods named after the http methods delete
, head
, put
and patch
.
The methods
post
, put
and patch
require a parameter containing the data to be sent.Performing Multiple Requests simultaneously
To execute multiple requests in parallel, simply provide an array argument to
axios.all
. When all requests are complete, you’ll receive an array containing the response objects in the same order they were sent. Alternatively you can use axios.spread
to spread the array into multiple arguments. Spread is preferred since dealing with array indexes could be misleading.// Requests will be executed in parallel...
axios.all([
axios.get('https://api.github.com/users/codeheaven-io');
axios.get('https://api.github.com/users/codeheaven-io/repos')
])
.then(axios.spread(function (userResponse, reposResponse) {
//... but this callback will be executed only when both requests are complete.
console.log('User', userResponse.data);
console.log('Repositories', reposResponse.data);
}));
Running axios in node
It might be obvious now, but running the code above should be pretty straightforward. Install axios with npm and require it as you do with any other dependency in node:
var axios = require('axios')
axios.get('https://api.github.com/users/codeheaven-io');
Running axios in the browser
Simply import axios (using a
axios.get('https://api.github.com/users/codeheaven-io');
from : http://codeheaven.io/how-to-use-axios-as-your-http-client/
tag, requirejs, browserify, webpack etc)
Sending custom headers with axios
To send custom headers supply an object containing the headers as the last argument:
var config = {
headers: {'X-My-Custom-Header': 'Header-Value'}
};
axios.get('https://api.github.com/users/codeheaven-io', config);
axios.post('/save', { firstName: 'Marlon' }, config);
You can read more information about axios here:https://github.com/mzabriskie/axios
from : http://codeheaven.io/how-to-use-axios-as-your-http-client/
沒有留言:
張貼留言