Axios
Axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中
特点
- 从浏览器中创建 XMLHttpRequests
- 从 node.js 创建 http 请求
- 支持 Promise API
- 拦截请求和响应
- 转换请求数据和响应数据
- 取消请求
- 自动转换 JSON 数据
- 客户端支持防御 XSRF
GET 方法
通过 params 设置参数,实际开发中常用
axios.get('/接口名', { params: { 参数名: 参数 } }) .then(function (response) { console.log(response); }) .catch(function (error) { console.log(error); });
POST请求
通过 data 设置参数,data可以省略
axios.post('/接口名', { 参数名: 参数 }) .then(function (response) { console.log(response); }) .catch(function (error) { console.log(error); });
axios全局配置
//配置公共的请求头 axios.defaults.baseURL = 'https://你设置的ip地址' // 配置超时时间 axios.defaults.timeout = 3000; // 配置公共请求头 axios.defaults.headers.common['Authorization'] = AUTH_TOKEN; //配置公共的post的Content-Type axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';
async/await
async/await 是ES7提出的基于Promise的解决异步的最终方案
- async是一个加在函数前的修饰符,被async定义的函数会默认返回一个Promise对象resolve的值。因此对async函数可以直接then,返回值就是then方法传入的函数。
- await 修饰的如果是Promise对象:可以获取Promise中返回的内容(resolve或reject的参数),且取到值后语句才会往下执行;如果不是Promise对象:把这个非promise的东西当做await表达式的结果。
用法
// async基础语法 async function fun0(){ console.log(1); return 1; } fun0().then(val=>{ console.log(val) // 1,1 }) async function fun1(){ console.log('Promise'); return new Promise(function(resolve,reject){ resolve('Promise') }) } fun1().then(val => { console.log(val); // Promise Promise })
await 也是一个修饰符,只能放在async定义的函数内。可以理解为等待。await 关键字仅在 async function 中有效。如果在 async function 函数体外使用 await ,你只会得到一个语法错误。
function testAwait (x) { return new Promise(resolve => { setTimeout(() => { resolve(x); }, 2000); }); } async function helloAsync() { var x = await testAwait ("hello"); console.log(x); } helloAsync ();//2s后输出hello