README.md 12.5 KB
Newer Older
M
mzabriskie 已提交
1
# axios
M
mzabriskie 已提交
2 3 4

[![npm version](https://img.shields.io/npm/v/axios.svg?style=flat-square)](https://www.npmjs.org/package/axios)
[![build status](https://img.shields.io/travis/mzabriskie/axios.svg?style=flat-square)](https://travis-ci.org/mzabriskie/axios)
M
mzabriskie 已提交
5 6
[![code coverage](https://img.shields.io/coveralls/mzabriskie/axios.svg?style=flat-square)](https://coveralls.io/r/mzabriskie/axios)
[![npm downloads](https://img.shields.io/npm/dm/axios.svg?style=flat-square)](https://www.npmjs.org/package/axios)
M
Matt Zabriskie 已提交
7
[![gitter chat](https://img.shields.io/gitter/room/mzabriskie/axios.svg?style=flat-square)](https://gitter.im/mzabriskie/axios)
M
Matt Zabriskie 已提交
8

M
mzabriskie 已提交
9
Promise based HTTP client for the browser and node.js
M
Matt Zabriskie 已提交
10 11 12

## Features

M
mzabriskie 已提交
13 14
- Make [XMLHttpRequests](https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest) from the browser
- Make [http](http://nodejs.org/api/http.html) requests from node.js
M
mzabriskie 已提交
15
- Supports the [Promise](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise) API
M
mzabriskie 已提交
16
- Intercept request and response
M
mzabriskie 已提交
17
- Transform request and response data
M
Matt Zabriskie 已提交
18
- Automatic transforms for JSON data
M
mzabriskie 已提交
19
- Client side support for protecting against [XSRF](http://en.wikipedia.org/wiki/Cross-site_request_forgery)
M
Matt Zabriskie 已提交
20

M
mzabriskie 已提交
21
## Browser Support
M
mzabriskie 已提交
22

23 24 25
![Chrome](https://raw.github.com/alrra/browser-logos/master/chrome/chrome_48x48.png) | ![Firefox](https://raw.github.com/alrra/browser-logos/master/firefox/firefox_48x48.png) | ![Safari](https://raw.github.com/alrra/browser-logos/master/safari/safari_48x48.png) | ![Opera](https://raw.github.com/alrra/browser-logos/master/opera/opera_48x48.png) | ![Edge](https://raw.github.com/alrra/browser-logos/master/edge/edge_48x48.png) | ![IE](https://raw.github.com/alrra/browser-logos/master/internet-explorer/internet-explorer_48x48.png) |
--- | --- | --- | --- | --- | --- |
Latest ✔ | Latest ✔ | Latest ✔ | Latest ✔ | Latest ✔ | 8+ ✔ |
M
mzabriskie 已提交
26

27 28
[![Browser Matrix](https://saucelabs.com/browser-matrix/axios.svg)](https://saucelabs.com/u/axios)

M
Matt Zabriskie 已提交
29 30 31 32 33 34 35 36 37 38 39 40 41 42
## Installing

Using bower:

```bash
$ bower install axios
```

Using npm:

```bash
$ npm install axios
```

M
Matt Zabriskie 已提交
43 44 45 46 47 48 49
## Example

Performing a `GET` request

```js
// Make a request for a user with a given ID
axios.get('/user?ID=12345')
M
mzabriskie 已提交
50 51 52 53 54 55
  .then(function (response) {
    console.log(response);
  })
  .catch(function (response) {
    console.log(response);
  });
56

M
Matt Zabriskie 已提交
57 58
// Optionally the request above could also be done as
axios.get('/user', {
M
mzabriskie 已提交
59 60 61 62 63 64 65 66 67 68
    params: {
      ID: 12345
    }
  })
  .then(function (response) {
    console.log(response);
  })
  .catch(function (response) {
    console.log(response);
  });
M
Matt Zabriskie 已提交
69 70 71 72 73 74
```

Performing a `POST` request

```js
axios.post('/user', {
M
mzabriskie 已提交
75 76 77 78 79 80 81 82 83
    firstName: 'Fred',
    lastName: 'Flintstone'
  })
  .then(function (response) {
    console.log(response);
  })
  .catch(function (response) {
    console.log(response);
  });
M
Matt Zabriskie 已提交
84 85
```

M
Matt Zabriskie 已提交
86 87
Performing multiple concurrent requests

M
Matt Zabriskie 已提交
88
```js
M
Matt Zabriskie 已提交
89
function getUserAccount() {
M
mzabriskie 已提交
90
  return axios.get('/user/12345');
M
Matt Zabriskie 已提交
91 92 93
}

function getUserPermissions() {
M
mzabriskie 已提交
94
  return axios.get('/user/12345/permissions');
M
Matt Zabriskie 已提交
95 96 97
}

axios.all([getUserAccount(), getUserPermissions()])
M
mzabriskie 已提交
98 99 100
  .then(axios.spread(function (acct, perms) {
    // Both requests are now complete
  }));
M
Matt Zabriskie 已提交
101 102
```

M
mzabriskie 已提交
103
## axios API
M
Matt Zabriskie 已提交
104

M
Matt Zabriskie 已提交
105
Requests can be made by passing the relevant config to `axios`.
M
Matt Zabriskie 已提交
106

M
Matt Zabriskie 已提交
107
##### axios(config)
M
Matt Zabriskie 已提交
108 109

```js
M
Matt Zabriskie 已提交
110
// Send a POST request
M
Matt Zabriskie 已提交
111
axios({
M
Matt Zabriskie 已提交
112 113 114 115 116 117
  method: 'post',
  url: '/user/12345',
  data: {
    firstName: 'Fred',
    lastName: 'Flintstone'
  }
M
Matt Zabriskie 已提交
118 119 120
});
```

M
Matt Zabriskie 已提交
121 122 123 124 125 126 127
##### axios(url[, config])

```js
// Sned a GET request (default method)
axios('/user/12345');
```

M
Matt Zabriskie 已提交
128 129 130 131
### Request method aliases

For convenience aliases have been provided for all supported request methods.

M
Matt Zabriskie 已提交
132 133 134 135 136 137
##### axios.get(url[, config])
##### axios.delete(url[, config])
##### axios.head(url[, config])
##### axios.post(url[, data[, config]])
##### axios.put(url[, data[, config]])
##### axios.patch(url[, data[, config]])
M
Matt Zabriskie 已提交
138 139

###### NOTE
M
Matt Zabriskie 已提交
140
When using the alias methods `url`, `method`, and `data` properties don't need to be specified in config.
M
Matt Zabriskie 已提交
141

M
Matt Zabriskie 已提交
142 143
### Concurrency

M
Matt Zabriskie 已提交
144 145
Helper functions for dealing with concurrent requests.

M
Matt Zabriskie 已提交
146 147 148
##### axios.all(iterable)
##### axios.spread(callback)

N
Nick Uraltsev 已提交
149 150 151 152 153 154 155 156
### Creating an instance

You can create a new instance of axios with a custom config.

##### axios.create([config])

```js
var instance = axios.create({
157
  baseURL: 'https://some-domain.com/api/',
N
Nick Uraltsev 已提交
158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174
  timeout: 1000,
  headers: {'X-Custom-Header': 'foobar'}
});
```

### Instance methods

The available instance methods are listed below. The specified config will be merged with the instance config.

##### axios#request(config)
##### axios#get(url[, config])
##### axios#delete(url[, config])
##### axios#head(url[, config])
##### axios#post(url[, data[, config]])
##### axios#put(url[, data[, config]])
##### axios#patch(url[, data[, config]])

M
Matt Zabriskie 已提交
175
## Request Config
M
Matt Zabriskie 已提交
176

N
Nick Uraltsev 已提交
177
These are the available config options for making requests. Only the `url` is required. Requests will default to `GET` if `method` is not specified.
M
Matt Zabriskie 已提交
178

M
Matt Zabriskie 已提交
179 180
```js
{
M
mzabriskie 已提交
181 182
  // `url` is the server URL that will be used for the request
  url: '/user',
183
  
184 185 186
  // `method` is the request method to be used when making the request
  method: 'get', // default

187 188 189 190
  // `baseURL` will be prepended to `url` unless `url` is absolute. 
  // It can be convenient to set `baseURL` for an instance of axios to pass relative URLs 
  // to methods of that instance.
  baseURL: 'https://some-domain.com/api/',
M
mzabriskie 已提交
191 192 193 194 195 196

  // `transformRequest` allows changes to the request data before it is sent to the server
  // This is only applicable for request methods 'PUT', 'POST', and 'PATCH'
  // The last function in the array must return a string or an ArrayBuffer
  transformRequest: [function (data) {
    // Do whatever you want to transform the data
197

M
mzabriskie 已提交
198 199 200 201 202 203 204
    return data;
  }],

  // `transformResponse` allows changes to the response data to be made before
  // it is passed to then/catch
  transformResponse: [function (data) {
    // Do whatever you want to transform the data
205

M
mzabriskie 已提交
206 207 208 209 210 211
    return data;
  }],

  // `headers` are custom headers to be sent
  headers: {'X-Requested-With': 'XMLHttpRequest'},

R
rupertrutland 已提交
212
  // `params` are the URL parameters to be sent with the request
M
mzabriskie 已提交
213 214 215
  params: {
    ID: 12345
  },
216 217 218 219 220 221

  // `paramsSerializer` is an optional function in charge of serializing `params`
  // (e.g. https://www.npmjs.com/package/qs, http://api.jquery.com/jquery.param/)
  paramsSerializer: function(params) {
    return Qs.stringify(params, {arrayFormat: 'brackets'})
  },
M
mzabriskie 已提交
222 223 224 225 226 227 228 229

  // `data` is the data to be sent as the request body
  // Only applicable for request methods 'PUT', 'POST', and 'PATCH'
  // When no `transformRequest` is set, must be a string, an ArrayBuffer or a hash
  data: {
    firstName: 'Fred'
  },

M
mzabriskie 已提交
230 231 232 233
  // `timeout` specifies the number of milliseconds before the request times out.
  // If the request takes longer than `timeout`, the request will be aborted.
  timeout: 1000,

M
mzabriskie 已提交
234 235 236 237
  // `withCredentials` indicates whether or not cross-site Access-Control requests
  // should be made using credentials
  withCredentials: false, // default

238 239 240 241 242 243
  // `adapter` allows custom handling of requests which makes testing easier.
  // Call `resolve` or `reject` and supply a valid response (see [response docs](#response-api)).
  adapter: function (resolve, reject, config) {
    /* ... */
  },

244
  // `auth` indicates that HTTP Basic auth should be used, and supplies credentials.
245 246
  // This will set an `Authorization` header, overwriting any existing
  // `Authorization` custom headers you have set using `headers`.
247
  auth: {
I
Idan Gazit 已提交
248 249
    username: 'janedoe',
    password: 's00pers3cret'
250 251
  }

M
mzabriskie 已提交
252 253 254 255 256 257 258 259
  // `responseType` indicates the type of data that the server will respond with
  // options are 'arraybuffer', 'blob', 'document', 'json', 'text'
  responseType: 'json', // default

  // `xsrfCookieName` is the name of the cookie to use as a value for xsrf token
  xsrfCookieName: 'XSRF-TOKEN', // default

  // `xsrfHeaderName` is the name of the http header that carries the xsrf token value
260 261 262 263 264 265
  xsrfHeaderName: 'X-XSRF-TOKEN', // default

  // `progress` allows handling of progress events for 'POST' and 'PUT uploads'
  // as well as 'GET' downloads
  progress: function(progressEvent) {
    // Do whatever you want with the native progress event
266 267 268 269
  },
  
  // `maxContentLength` defines the max size of the http response content allowed
  maxContentLength: 2000
M
Matt Zabriskie 已提交
270 271 272
}
```

M
Matt Zabriskie 已提交
273
## Response Schema
M
Matt Zabriskie 已提交
274

M
mzabriskie 已提交
275 276 277 278
The response for a request contains the following information.

```js
{
M
mzabriskie 已提交
279 280 281 282 283
  // `data` is the response that was provided by the server
  data: {},

  // `status` is the HTTP status code from the server response
  status: 200,
284

M
mzabriskie 已提交
285
  // `statusText` is the HTTP status message from the server response
M
mzabriskie 已提交
286
  statusText: 'OK',
M
mzabriskie 已提交
287 288 289 290 291 292

  // `headers` the headers that the server responded with
  headers: {},

  // `config` is the config that was provided to `axios` for the request
  config: {}
M
mzabriskie 已提交
293 294 295
}
```

M
mzabriskie 已提交
296
When using `then` or `catch`, you will receive the response as follows:
M
Matt Zabriskie 已提交
297

M
Matt Zabriskie 已提交
298
```js
M
Matt Zabriskie 已提交
299
axios.get('/user/12345')
M
mzabriskie 已提交
300 301 302
  .then(function(response) {
    console.log(response.data);
    console.log(response.status);
M
mzabriskie 已提交
303
    console.log(response.statusText);
M
mzabriskie 已提交
304 305 306 307 308
    console.log(response.headers);
    console.log(response.config);
});
```

M
Matt Zabriskie 已提交
309 310 311 312 313 314 315 316 317 318 319 320 321 322 323 324 325 326 327 328
## Config Defaults

You can specify config defaults that will be applied to every request.

### Global axios defaults

```js
axios.defaults.baseURL = 'https://api.example.com';
axios.defaults.headers.common['Authorization'] = AUTH_TOKEN;
axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';
```

### Custom instance defaults

```js
// Set config defaults when creating the instance
var instance = axios.create({
  baseURL: 'https://api.example.com'
});

M
Marcelo Jorge Vieira 已提交
329
// Alter defaults after instance has been created
M
Matt Zabriskie 已提交
330 331 332 333 334 335 336 337 338 339 340 341 342 343 344 345 346 347 348 349 350 351
instance.defaults.headers.common['Authorization'] = AUTH_TOKEN;
```

### Config order of precedence

Config will be merged with an order of precedence. The order is library defaults found in `lib/defaults.js`, then `defaults` property of the instance, and finally `config` argument for the request. The latter will take precedence over the former. Here's an example.

```js
// Create an instance using the config defaults provided by the library
// At this point the timeout config value is `0` as is the default for the library
var instance = axios.create();

// Override timeout default for the library
// Now all requests will wait 2.5 seconds before timing out
instance.defaults.timeout = 2500;

// Override timeout for this request as it's known to take a long time
instance.get('/longRequest', {
  timeout: 5000
}); 
```

M
mzabriskie 已提交
352 353 354 355 356 357 358 359 360 361 362 363 364 365 366 367 368 369 370 371 372 373 374 375 376 377 378 379 380 381 382
## Interceptors

You can intercept requests or responses before they are handled by `then` or `catch`.

```js
// Add a request interceptor
axios.interceptors.request.use(function (config) {
    // Do something before request is sent
    return config;
  }, function (error) {
    // Do something with request error
    return Promise.reject(error);
  });

// Add a response interceptor
axios.interceptors.response.use(function (response) {
    // Do something with response data
    return response;
  }, function (error) {
    // Do something with response error
    return Promise.reject(error);
  });
```

If you may need to remove an interceptor later you can.

```js
var myInterceptor = axios.interceptors.request.use(function () {/*...*/});
axios.interceptors.request.eject(myInterceptor);
```

N
Nick Uraltsev 已提交
383 384 385 386 387 388 389
You can add interceptors to a custom instance of axios.

```js
var instance = axios.create();
instance.interceptors.request.use(function () {/*...*/});
```

M
mzabriskie 已提交
390 391 392 393 394 395 396 397 398 399 400 401 402 403 404 405 406
## Handling Errors

```js
axios.get('/user/12345')
  .catch(function (response) {
    if (response instanceof Error) {
      // Something happened in setting up the request that triggered an Error
      console.log('Error', response.message);
    } else {
      // The request was made, but the server responded with a status code
      // that falls out of the range of 2xx
      console.log(response.data);
      console.log(response.status);
      console.log(response.headers);
      console.log(response.config);
    }
  });
M
mzabriskie 已提交
407 408
```

M
mzabriskie 已提交
409 410 411 412 413 414 415 416 417 418
## Semver

Until axios reaches a `1.0` release, breaking changes will be released with a new minor version. For example `0.5.1`, and `0.5.4` will have the same API, but `0.6.0` will have breaking changes.

## Promises

axios depends on a native ES6 Promise implementation to be [supported](http://caniuse.com/promises).
If your environment doesn't support ES6 Promises, you can [polyfill](https://github.com/jakearchibald/es6-promise).

## TypeScript
M
mzabriskie 已提交
419
axios includes a [TypeScript](http://typescriptlang.org) definition.
420 421
```typescript
/// <reference path="axios.d.ts" />
422
import * as axios from 'axios';
423 424 425
axios.get('/user?ID=12345');
```

M
Matt Zabriskie 已提交
426
## Credits
M
Matt Zabriskie 已提交
427

M
Matt Zabriskie 已提交
428 429
axios is heavily inspired by the [$http service](https://docs.angularjs.org/api/ng/service/$http) provided in [Angular](https://angularjs.org/). Ultimately axios is an effort to provide a standalone `$http`-like service for use outside of Angular.

M
Matt Zabriskie 已提交
430 431
## License

432
MIT