原创axios浏览器中异步请求代码封装

axios 是一个基于Promise 用于浏览器和 nodejs 的 HTTP 客户端，简单的理解就是ajax的封装。

在Vue 版本推荐使用 axios 来完成 ajax 请求。

安装方法：

方法一、npm安装

命令：$ npm install axios

方法二、直接引入

<script src="https://unpkg.com/axios/dist/axios.min.js"></script>

axios的简单封装，可以直接复制使用，代码如下：

//封装axios函数
function hiAxios(url,...args){ if(typeof(url)=="object"){ return axios(url); }else{ let obj = {}, fn = function () { }, method = 'get', fdata = function (obj, type) { if (type == 'get') { return { params: obj }; } else { let params = new FormData(); for (let key in obj) { params.append(key, obj[key]); } return params; } }, getVals = function (val) { switch (typeof (val)) { case 'string': method = val; break; case 'function': fn = val; break; case 'object': obj = val; break; } }, res=function(obj){ let res=obj.status==200?obj.data:obj; fn(res); }; args.forEach(function (item, index) {  getVals(item); }); switch (method) { case 'get': axios.get(url, fdata(obj, method)).then(function(response){ res(response); }).catch(function (error) { res(error); }); break; case 'post': axios.post(url, fdata(obj, method)).then(function(response){ res(response); }).catch(function (error) { res(error); }); break; } } }

调用实例

使用方法一：直接调用

语法：hiAxios(url[,get|post,data,fn])，注意：默认get方式；其中data参数类型为object；fn为回调函数

代码如下：

hiAxios('test.php');
		//或
		hiAxios('test.php', function(res){ alert(JSON.stringify(res)); });
		//或
		hiAxios('test.php', 'post', {name:'哈喽吧', domain:'www.hilo8.com'}, function(res){ alert(JSON.stringify(res)); });

使用方法二： 传递相关配置来创建请求

语法：hiAxios(config)，跟原始api一样

代码如下：

hiAxios({
			//请求的服务器 URL
			url:'test.php',
			//请求时使用的方式，默认get
			method:'get',
			//允许在向服务器发送前，修改请求数据
			transformRequest: [function (data) {
				//console.log(data);
				return data; //可用于post方式请求时序列化data参数
			}],
			//在传递给 then/catch 前，允许修改响应数据
			transformResponse: [function (data) {
				//console.log(data);
				return data;
			}],
			//get方式传递参数
			params: {
				name: '哈喽吧'
			},
			//post方式传递参数
			data: {
				domain: "www.hilo8.com"
			},
			//...更多配置参数
		})
		.then(res=>{ alert(JSON.stringify(res)); })
		.catch(err=>{ alert(err); });