import axios from 'axios' // 导入axios
import qs from 'qs' // 导入qs
import Vue from 'vue' // 导入vue
import router from '../router' // 导入路由文件
import md5 from 'md5' // 导入md5加密
import JSEncrypt from 'jsencrypt' // 导入rsa加密
import { Toast, Indicator } from 'mint-ui' // 导入UI框架
import apis from './api' // 导入接口文件
import BASE_URL from '../config' // 导入配置文件
// 发送请求前的动作
axios.interceptors.request.use(config => {
// 可以显示loading
Indicator.open();
return config
}, error => {
return Promise.reject(error)
})
// 接收响应前的动作
axios.interceptors.response.use(response => {
// 可以清除loading
Indicator.close();
return response
}, error => {
return Promise.resolve(error)
})
// 对需要提交的data做筛选,根据配置文件apis的常量,筛选出不需要加密的字段
function dataScreen(data, body){
let obj = {};
let o = {};
for(let item in data){
if(~body.indexOf(item)){
o[item] = data[item];
}else{
obj[item] = data[item];
}
}
o.data = obj;
return o;
}
// 对需要sign的参数进行字段名称排序,把对应的值进行拼接
function getObjSort(obj) {
let keys = Object.keys(obj).sort();
if(arguments.length <= 0) return false;
let str = '';
for(let i = 0; i < keys.length; i++) {
str += obj[keys[i]];
}
return str;
}
// 对拼接好的字符串进行公钥加密,返回sign字符串
function getSign(str){
let encrypt = new JSEncrypt();
let sign = '';
encrypt.setPublicKey(apis.PUBLIC_KEY); //设置公钥key
str = encodeURI(str);
for(var i = 0; i <= parseInt(str.length / 117); i++) {
sign += encrypt.encrypt(str.substr(i * 117, 117))
}
return sign;
}
const vueAjax = (opts, data, body, describe) => {
let o = dataScreen(data, body); // 发送前对参数进行处理
let sign = md5(getObjSort(o.data)); // 进行md5加密
// console.log("【sign前】" + getObjSort(o.data))
console.log("【加密前】" + JSON.stringify(o.data))
o.data = getSign(JSON.stringify(o.data)); // 用JSEncrypt进行RSA加密
// console.log("【request】" + JSON.stringify(o))
let publicOpts = { // 传给后台的公共参数
// username: '1234567890'
}
let headers = {}
headers.sign = sign;
let defaultOpts = { // 请求的配置
url: opts.url, // 请求的url
method: opts.method, // 请求的类型
baseURL: BASE_URL, // 请求地址前缀
timeout: 10000, // 超时的时间
headers: Object.assign(headers, apis.HEADERS),
params: Object.assign(publicOpts, o), // get请求的参数序列
data: qs.stringify(Object.assign(publicOpts, o)), // post请求的参数序列
}
if(opts.method=='get') delete defaultOpts.data;
else delete defaultOpts.params;
let promise = new Promise((resolve, reject) => {
// 发起请求 给请求建立一个promise,方便页面中处理异步
axios(defaultOpts).then(
// 请求成功后,根据与后台的协定,编写对应逻辑
(res) => {
let d = res.data;
if (d.msg == 1) {
resolve(d); // promise成功后的回调
}else if(d.msg == 3){
router.push({name:'error',params:{type:'token'}}) // 这里是登录超时后跳转致错误页
}else{
reject(d);
}
// console.log(describe + "——" + JSON.stringify(res.data))
}
).catch(
(error) => {
Indicator.close();
//errorFn(error);
reject(error); // promise失败后的回调
}
)
})
return promise;
}
export default vueAjax;
config.js
let BASE_URL = ""; //这里是一个默认的url,可以没有
switch (process.env.NODE_ENV) {
case 'development':
BASE_URL = "http://192.168.13.195:8080" //这里是本地的请求
break
case 'test':
BASE_URL = "http://bhrbeta.bhome.com.cn/workers_attendance" // 自定义的测试环境
break
case 'production':
BASE_URL = "http://attendance.bhome.com.cn/workers_attendance" //生产环境
break
}
export default BASE_URL;
再在package.json加入
{
"serve": "vue-cli-service serve",
"test": "vue-cli-service build --mode test",
"build": "vue-cli-service build"
}
有不明白,或者更好的建议,请留言,谢谢
注:爱护原创,转载请说明出处