Node.js搭建WEB服务器，二次封装axios

自己做案例总结的，仅供参考

Node.js三个特点：

1. 单线程
2. 非阻塞 I / O
3. 事件驱动 event-driven

axios中的一些属性

transformRequest

1. 允许在向服务器发送前，修改请求数据
2. 只能用在 ‘PUT’, ‘POST’ 和 ‘PATCH’ 这几个请求方法
3. 后面数组中的函数必须返回一个字符串

// 在真正的工作中；需要对axios请求进行二次封装；
import axios from "axios";
// http 是生成一个axios发送请求的实例；
const http = axios.create({
    baseUrl:"",
    transformRequest(data){// 
        // console.log(data);
        // data： 就是post请求接受到的参数，需要返回一个字符串
        let str  ="";
        for(let key in data){
            str+=`${key}=${data[key]}&`
        }
        return str;
    },
    // 给每一个请求拼接t，t的值是随机数，防止走缓存
    params:{
        t:Math.random()
    },
    timeout:2000
});
// 添加请求拦截器
http.interceptors.request.use(function(config){
    // 在请求之前可以做做一些事情
    return config;
},function (error) {
    // 对请求错误做些什么
    return Promise.reject(error);
});
// 
// 添加响应拦截器
http.interceptors.response.use(function (response) {
    // 对响应数据做点什么
    // response 就是请求回来的响应体
    return response.data;// 那么请求后面then就可以直接接受到响应的数据
  }, function (error) {
    // 对响应错误做点什么
    return Promise.reject(error);
  });
  export default http;



// 在真正的工作中，需要对axios进行二次封装
import axios from 'axios';
import qs from 'qs'; // 这个插件是你下载axios的时候自动下载的
//qs.stringify()将对象 序列化成URL的形式，以&进行拼接
const http = axios.create({
    // baseUrl:''
    transformRequest(data={}) {
        console.log(data, 'http->6')
        // {account:'123',password:'666'}
        // 只针对于post请求有效
        // data就是你想服务器发送的请求参数，这个函数必须返回一个字符串
        // data.time = Math.random();

        // let str = ``;
        // for(var key in data){
        //     str+=`${key}=${data[key]}&`
        // }
        // return str
        
        data = qs.stringify(data);
        // account=111&password=222
        return data
        // console.log(qs, 'http->18')


    },
    //  params: {
    //     ID: 12345
    // },
    timeout: 2000,
    
});
// 添加请求拦截器
http.interceptors.request.use(function (config) {
    // 在发送请求之前做些什么
    return config;
  }, function (error) {
    // 对请求错误做些什么
    return Promise.reject(error);
  });

// 添加响应拦截器
http.interceptors.response.use(function (response) {
    // 对响应数据做点什么
    // console.log(response,355)
    return response.data;
  }, function (error) {
    // 对响应错误做点什么
    return Promise.reject(error);
  });


// http.post('index/item').then((data)=>{
//     console.log(data)
// })
// http.post('index/list')

export default http;

关于登陆，注册封装的axios

import axios from 'axios';
import qs from 'qs';
//=>基础全局配置
axios.defaults.baseURL = "http://127.0.0.1:9999";
axios.defaults.timeout = 10000;
axios.defaults.withCredentials = true;
//=>POST请求，请求主体数据格式处理
axios.defaults.headers['Content-Type'] = 'application/x-www-form-urlencoded';
axios.defaults.transformRequest = data => qs.stringify(data);
/* 
axios.interceptors.request.use(config => {
	//=>TOKEN处理
	let token = localStorage.getItem('token');
	token && (config.headers.Authorization = token);
	return config;
}, error => {
	return Promise.reject(error);
}); 
*/
axios.interceptors.response.use(response => {
	//=>只拿到响应主体信息
	return response.data;
}, error => {
	if (error.response) {
		switch (error.response.status) {
			//=>错误状态码处理
		}
	} else {
		if (!window.navigator.onLine) {
			//=>断网处理
			return;
		}
		return Promise.reject(error);
	}
});
export default axios;

axios官网：http://www.axios-js.com/zh-cn/docs/