初步封装

//http类
// 每次请求接口时都会根据code判断当前的问题（判断登录状态），例如：code=4xx时，可能是token过期或用户点击了取消
// 当token没有过期，并存在时才会进行后面的操作。token可以通过调用登录接口获取
class Http {
    // 静态变量，可以通过Http.request的方式使用
    static request(params) {
        // 给传入变量设置默认值，定义数据
        const method = params.method || 'GET',
            data = params.data || {},
            apiBaseUrl = params.apiBaseUrl || {},
            hideLoading = params.hideLoading || false,
            token = uni.getStorageSync('token') || '',
            employeeId = uni.getStorageSync('employeeId') || '1',
            companyId = uni.getStorageSync('companyId') || '1';
        // 如果当前请求接口时，屏幕出现提示： 加载中...
        if (!hideLoading) {
            uni.showLoading({
                title: '加载中...'
            });
        }
        // 返回一个promise对象（接口的请求，为了不影响页面的显示等，使用promise）
        return new Promise((resolve, reject) => {
            // 调用源生的request，请求数据
            uni.request({
                url: `${apiBaseUrl}${params.url}`,
                method,
                // 请求头设置
                header: {
                    'content-type': 'application/json',
                    'Token': token,//携带的token
                    'employeeId': employeeId,//员工id
                    'companyId': companyId
                },
                data,
                // 成功时返回信息，res中就是保存信息的对象
                success: res => {
                    //动态判断是否跳出当前函数，相当于return，但不会直接导致这之后的代码不运行    
                    typeof params.success == "function" && params.success(res.data);
                    if (res.data.code == 200) {
                        // 成功时返回数据
                        resolve(res.data.data)
                    } else if (res.data.code == 500) {
                        // 服务器出错时返回数据
                        let message = ''
                        // 将服务器错误时的信息，显示到页面上
                        if (res.data.message) {
                            message = res.data.message
                        } else if (res.data.data.message) {
                            message = res.data.data.message
                        }
                        uni.showModal({
                            content: "" + message,
                            showCancel: false
                        });
                        // 请求出错
                    } else if (res.data.code == 401 || res.data.code == 403) {
                        // 提示出错的原因
                        uni.showModal({
                            content: '您尚未登录或者登录已过期，请点击确定返回登录',
                            // 这里是根据用户的点击，例如showModual的这两个属性"cancelText":"取消","confirmText":"登录",
                            // 通过用户的点击，res会返回不同的数据，用来判断如何进行下一步操作
                            success: function(res) {
                                // 点击登录用户将跳转到登录也买你
                                if (res.confirm) {
                                    //token登录过期删除token
                                    uni.removeStorageSync('token');
                                    // 返回登录页面
                                    uni.navigateTo({
                                        url: '/pages/login/login'
                                    })
                                } else if (res.cancel) {
                                    console.log('用户点击取消');
                                }
                            }
                        });
                        reject(false)
                    }
                },
                // 请求失败时
                fail: (err) => {
                    // 提示网络连接错误
                    uni.showModal({
                        content: "网络连接错误"
                    });
                    typeof params.fail == "function" && params.fail(e.data);
                    // 返回错误信息
                    reject(err);
                },
                // 无论请求成功还是失败都会执行complete中的信息
                complete: () => {
                    // 隐藏加载中的提示信息
                    if (!hideLoading) {
                        uni.hideLoading();
                    }
                    // 跳出函数，相当于return false
                    typeof params.complete == "function" && params.complete();
                    return;
                }
            })
        })
    }
}
export {
    Http
}

再给不同接口进行封装

import {
    Http
} from '../utils/http.js';
import config from '../config/config.js';
// 公司热门产品列表
export function fetchProductCompanyHot(id) {
    return Http.request({
        apiBaseUrl: config.apiBusinessUrl,
        url: `/business/product/company/hot/${id}`,
        method: 'POST'
    })
}
// 查询产品详情
export function fetchProductDetail(id) {
    return Http.request({
        apiBaseUrl: config.apiProductUrl,
        url: `/product/frontProduct/detail/${id}`,
        method: 'POST'
    })
}
// 查询ta的推荐产品列表
export function fetchTaRecommend(data) {
    return Http.request({
        apiBaseUrl: config.apiBusinessUrl,
        url: '/business/product/taRecommend/list',
        method: 'POST',
        data
    })
}
// 根据规格查询产品价格
export function fetchPriceByStandar(data) {
    return Http.request({
        apiBaseUrl: config.apiProductUrl,
        url: '/product/frontProduct/price',
        method: 'POST',
        hideLoading: true,
        data
    })
}
// 新增留言
export function createMessage(data) {
    return Http.request({
        apiBaseUrl: config.apiBusinessUrl,
        url: '/business/message/addMessage',
        method: 'POST',
        data
    })
}
// 根据员工id获取产品列表
export function fetchUserProduct() {
    return Http.request({
        apiBaseUrl: config.apiBusinessUrl,
        url: `/business/product/userProduct/list/`,
        method: 'POST'
    })
}
// 生成邀请二维码
export function qrCode() {
    return Http.request({
        apiBaseUrl: config.apiBusinessUrl,
        url: '/app/qrCode',
        method: 'POST'
    })
}