关于ajax的封装

env.js:

/**
 *
 * baseUrl: 域名地址
 * baseImgPath: 图片存放地址
 *
 */
let baseUrl = 'https://xxxxxxxxx';//后台baseUrl
let baseImgPath;

var baseOrigin=window.location.origin;
if(baseOrigin&&baseOrigin.includes('http')&&baseOrigin!='http://localhost:8080'){
	baseUrl=window.location.origin;
}
export {
	baseUrl,
	// routerMode,
	baseImgPath
}

request.js:

import axios from 'axios';
import {
  baseUrl
} from './env';
//自动切换环境
axios.defaults.baseURL = baseUrl; //默认请求地址
//设置超时时间
axios.defaults.timeout = 10000;
// post请求头
axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=UTF-8';

//对外接口
export function request({
  method,
  url,
  params
}) {
  if (method == 'Get') {
    return get(url, params);
  } else if (method == 'Post') {
    return post(url, params);
  } else if (method == 'Upload') {
    return upload(url, params);
  }
}

// 封装get方法
function get(url, params) {
  return new Promise((resolve, reject) => {
    axios.get(url, {
      params: params
    }).then(res => {
      resolve(res.data);
    }).catch(err => {
      reject(err.data);
    })
  });
}

// 封装post方法
function post(url, params) {
  return new Promise((resolve, reject) => {
    axios.post(url, QS.stringify(params)).then(res => {
      resolve(res.data);
    }).catch(err => {
      reject(err.data);
    })
  });
}

// 封装upload方法
function upload(url, params) {
  let config = {
    headers: {
      'Content-Type': 'multipart/form-data'
    }
  };
  return new Promise((resolve, reject) => {
    axios.post(url, params, config).then(res => {
      resolve(res.data);
    }).catch(err => {
      reject(err.data);
    })
  });
}

service.js:

import {
  request
} from '../config/request'
const xxxServer = { //自定义名称
  xxxGet(params) { //get调用示例
    return request({
      method: 'Get',
      url: '路径', 
      params: params
    })
  },
  xxxUpload(params, flag) {
    if (flag && flag == 1) { //upload示例
      return request({
        method: 'Upload',
        url:  '路径',
        params: params
      })
    } else {
      return request({
        method: 'Post',
        url:  '路径',
        params: params
      })
    }
  },
  xxxPost(params) { //post示例
    return request({
      method: 'Post',
      url: '路径',
      params: params,
    })
  }
}
export default xxxServer

实际调用:

import xxxServer from '路径'
xxxServer.xxxGet({参数}).then(res=>{
	...
}).catch(err =>{
	...
})
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值