uView2.0 对http进行封装
request.js:
// 此vm参数为页面的实例,可以通过它引用vuex中的变量 import { $config } from '@/config/config'; module.exports = (vm) => { // 初始化请求配置 uni.$u.http.setConfig((config) => { /* config 为默认全局配置*/ config.baseURL = $config.baseUrl; /* 根域名 */ return config; }); // 请求拦截 uni.$u.http.interceptors.request.use( (config) => { // 可使用async await 做异步操作 // 初始化请求拦截器时,会执行此方法,此时data为undefined,赋予默认{} config.data = config.data || {}; // 根据custom参数中配置的是否需要token,添加对应的请求头 if (config?.custom?.auth) { // 可以在此通过vm引用vuex中的变量,具体值在vm.$store.state中 config.header.Authorization = vm.access_token; } return config; }, (config) => { // 可使用async await 做异步操作 return Promise.reject(config); } ); // 响应拦截 uni.$u.http.interceptors.response.use( (response) => { // statusCode为200的情况 return response.data === undefined ? {} : response.data; }, (response) => { // token验证失败 const { status, msg, data } = response; // 自定义参数 const custom = response.config?.custom; // 如果没有显式定义custom的toast参数为false的话,默认对报错进行toast弹出提示 if (custom.toast !== false) { uni.$u.toast(msg); } if (statusCode === 401) { setTimeout(() => { uni.$u.route('pages/login/login'); }, 1500); } if (custom?.catch) { return Promise.reject(data); } else { // 否则返回一个pending中的promise,请求不会进入catch中 return new Promise(() => {}); } } ); };
在main.js中引入:
// 引入请求封装,将app参数传递到配置中 require('./config/request.js')(app); app.$mount();
api.js使用:
const http = uni.$u.http; // post请求 export const postMenu = (params, config = {}) => http.post('/ebapi/public_api/index', params, config); // get请求,注意:get请求的配置等,都在第二个参数中 export const getMenu = (data) => http.get('/ebapi/public_api/index', data);
希望大佬看到有不对的地方,提出博主予以改正!