uniapp-封装http

447 阅读1分钟

创建common/http.js

let url = ''
export const baseUrl = url;
export function http(url, data, method = 'GET', header) {
    return new Promise((resolve, reject) => {
        uni.request({
            url: '/prod-api' + url,
            header: header||{
                'Authorization':url=='/login/loginApi'?'': uni.getStorageSync('token'),
                'Accept-Encoding':'gzip, deflate'
            },
            data,
            method,
	    success: (res) => {
		if (res.statusCode == 200) {
		    console.log(res)
		    if (res.data.code == 200) {
			resolve(res.data)
		    } else if (res.data.code == 400||res.data.code == 500) {
			uni.showToast({
			    title: res.data.msg,
			    icon: 'none'
			})
			reject(res.data)
		    } else if (res.data.code == 401) {
			let pages = getCurrentPages();
			var currPage = pages[pages.length - 1];
			let url = '/' + currPage.route;
			if (uni.getStorageSync('userInfo')) {
			//登陆过期
			    uni.showToast({
			        title: "登录过期",
				icon: 'none'
			    })
			    uni.removeStorageSync('userInfo')
			    uni.removeStorageSync('token')
			    setTimeout(() => {
				uni.redirectTo({
				    url: '/pages/login/login?url=' + url
				})
			    }, 500)
			} else {
			    uni.redirectTo({
				url: '/pages/login/login?url=' + url
			    })
			}
		    }
		} else {
		    uni.showToast({
			title: "接口请求失败" + res.statusCode,
			icon: 'none'
		    })
		}
	    },
	    fail: (res) => {
	        console.log(res)
	        uni.showToast({
		    title: '服务器请求异常',
		    icon: 'none'
	        })
	    },
	    complete: () => {

	    }
        });
    })
}

main.js
// 全局引入http
import {
	http,
} from './common/http.js'
Vue.prototype.$http = http

优化

// http.js
const prodApiPrefix = '/prod-api';

// 基础配置
const baseConfig = {
  timeout: 5000,
  header: {
    'Accept-Encoding': 'gzip, deflate'
  }
};

// HTTP请求方法
export function http(url, data, method = 'GET', customHeader = {}) {
  return new Promise((resolve, reject) => {
    const finalHeader = {
      ...baseConfig.header,
      ...customHeader,
      'Authorization': url === '/login/loginApi' ? '' : uni.getStorageSync('token')
    };

    uni.request({
      url: prodApiPrefix + url,
      header: finalHeader,
      data,
      method,
      success: handleResponse,
      fail: handleError,
      complete: () => {}
    });
  });
}

// 处理响应
function handleResponse(res) {
  if (res.statusCode === 200) {
    console.log(res);
    if (res.data.code === 200) {
      resolve(res.data);
    } else if (res.data.code === 400 || res.data.code === 500) {
      uni.showToast({
        title: res.data.msg,
        icon: 'none'
      });
      reject(res.data);
    } else if (res.data.code === 401) {
      handleUnauthorized();
    }
  } else {
    uni.showToast({
      title: `接口请求失败: ${res.statusCode}`,
      icon: 'none'
    });
    reject(res);
  }
}

// 处理错误
function handleError(err) {
  console.log(err);
  uni.showToast({
    title: '服务器请求异常',
    icon: 'none'
  });
  reject(err);
}

// 处理未授权
function handleUnauthorized() {
  let pages = getCurrentPages();
  let currPage = pages[pages.length - 1];
  let redirectUrl = '/' + currPage.route;
  uni.showToast({
    title: "登录过期",
    icon: 'none'
  });
  uni.removeStorageSync('userInfo');
  uni.removeStorageSync('token');
  setTimeout(() => {
    uni.redirectTo({
      url: `/pages/login/login?url=${encodeURIComponent(redirectUrl)}`
    });
  }, 500);
}