//axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中。 // 可以通过向 axios 传递相关配置来创建请求 // axios(config) axios({ // `url` 是用于请求的服务器 URL url: ‘/user‘, // `method` 是创建请求时使用的方法 method: ‘get‘, // default // `data` 是作为请求主体被发送的数据 // 只适用于这些请求方法 ‘PUT‘, ‘POST‘, 和 ‘PATCH‘ // 在没有设置 `transformRequest` 时,必须是以下类型之一: // - string, plain object, ArrayBuffer, ArrayBufferView, URLSearchParams // - 浏览器专属:FormData, File, Blob // - Node 专属: Stream data: { firstName: ‘Fred‘ }, // `params` 是即将与请求一起发送的 URL 参数 // 必须是一个无格式对象(plain object)或 URLSearchParams 对象 params: { ID: 12345 }, // `responseType` 表示服务器响应的数据类型, // 可以是 ‘arraybuffer‘, ‘blob‘, ‘document‘, ‘json‘, ‘text‘, ‘stream‘ responseType: ‘json‘, // default // `baseURL` 将自动加在 `url` 前面,除非 `url` 是一个绝对 URL。 // 它可以通过设置一个 `baseURL` 便于为 axios 实例的方法传递相对 URL baseURL: ‘https://some-domain.com/api/‘, // `transformRequest` 允许在向服务器发送前,修改请求数据 transformRequest: [function (data, headers) { // 对 data 进行任意转换处理 return data; //必须返回一个字符串,或 ArrayBuffer,或 Stream }], // `transformResponse` 在传递给 then/catch 前,允许修改响应数据 transformResponse: [function (data) { // 对 data 进行任意转换处理 return data; }], // `auth` 表示应该使用 HTTP 基础验证,并提供凭据 // 这将设置一个 `Authorization` 头,覆写掉现有的任意使用 `headers` 设置的自定义 `Authorization`头 auth: { username: ‘janedoe‘, password: ‘s00pers3cret‘ }, // ‘proxy‘ 定义代理服务器的主机名称和端口 // `auth` 表示 HTTP 基础验证应当用于连接代理,并提供凭据 // 这将会设置一个 `Proxy-Authorization` 头,覆写掉已有的通过使用 `header` 设置的自定义 `Proxy-Authorization` 头。 proxy: { host: ‘127.0.0.1‘, port: 9000, auth: { username: ‘mikeymike‘, password: ‘rapunz3l‘ } } }) .then((response) => { // `data` 由服务器提供的响应 // data: {}, console.log(response.data); // `status` 来自服务器响应的 HTTP 状态码 // status: 200, console.log(response.status); // `statusText` 来自服务器响应的 HTTP 状态信息 // statusText: ‘OK‘, console.log(response.statusText); }) .catch(function (error) { if (error.response) { console.log(error.response.data); console.log(error.response.status); console.log(error.response.headers); } else if (error.request) { // 请求已发出,但未收到响应“error.request”是浏览器中的XMLHttpRequest实例和 // node.js中的http.ClientRequest实例 console.log(error.request); } else { // 在设置引发错误的请求时发生了一些事情 console.log(‘Error‘, error.message); } })
// 拦截器 // 在请求或响应被 then 或 catch 处理前拦截它们。 // 添加请求拦截器 axios.interceptors.request.use(function (config) { // 在发送请求之前做些什么 return config; }, function (error) { // 对请求错误做些什么 return Promise.reject(error); }); // 添加响应拦截器 axios.interceptors.response.use(function (response) { // 对响应数据做点什么 return response; }, function (error) { // 对响应错误做点什么 return Promise.reject(error); }); // 如果你想在稍后移除拦截器,可以这样: const myInterceptor = axios.interceptors.request.use(function () {/*...*/}); axios.interceptors.request.eject(myInterceptor); // 在使用别名方法时, url、method、data 这些属性都不必在配置中指定。 // 执行 GET 请求 // 为给定 ID 的 user 创建请求 axios.get(‘/user?ID=12345‘) .then(function (response) { console.log(response); }) .catch(function (error) { console.log(error); }); // 上面的请求也可以这样做 axios.get(‘/user‘, { params: { ID: 12345 } }) .then(function (response) { console.log(response); }) .catch(function (error) { console.log(error); }); // 执行 POST 请求 axios.post(‘/user‘, { firstName: ‘Fred‘, lastName: ‘Flintstone‘ }) .then(function (response) { console.log(response); }) .catch(function (error) { console.log(error); }); // 执行多个并发请求 function getUserAccount() { return axios.get(‘/user/12345‘); } function getUserPermissions() { return axios.get(‘/user/12345/permissions‘); } axios.all([getUserAccount(), getUserPermissions()]) .then(axios.spread(function (acct, perms) { // 两个请求现在都执行完成 // acct: getUserAccount请求返回的数据 // perms:getUserPermissions请求返回的数据 })); // es6语法 const data = { ‘bar‘: 123 }; const options = { method: ‘POST‘, headers: { ‘content-type‘: ‘application/x-www-form-urlencoded‘ }, data: JSON.stringify(data), url: ‘http://....‘, }; axios(options); // Node.js // 在node.js中,您可以使用querystring模块,如下所示: const querystring = require(‘querystring‘); axios.post(‘http://something.com/‘, querystring.stringify({ foo: ‘bar‘ }));