小程序封装请求方法及踩过的坑

最新推荐文章于 2024-06-04 14:12:16 发布

我是一梓渔

最新推荐文章于 2024-06-04 14:12:16 发布

阅读量267

点赞数

文章标签：小程序

本文链接：https://blog.csdn.net/weixin_48297537/article/details/107640169

版权

/**
 * HTTP_BASE_URL: 请求地址
 * _method： 请求方法
 * data：发送数据
 * callback：回调函数
 * boo作用： 请求接口时， 显示loadding， 默认"显示"
 */
const app = getApp();
const HTTP_BASE_URL = "服务器地址=====/";//测试地址 提交
function api(_method, url, data, callback, boo = true) {
    console.log(data, "----发送数据----")
    if (boo) {
        wx.showLoading({
            title: '加载中',
        })
    }

    wx.request({
        url: HTTP_BASE_URL + url + ".do",
        method: _method,
        data:data,
        header: {
            'content-type': 'application/json'
        },

        success: (res) => {
            if (boo) {
                wx.hideLoading()
            }
            if (res.statusCode == 200) {               
                ”操作调取回来数据“
                }
            } else {
                console.log(res, "发送后台返回错误码及对应问题")
               wx.showModal({
                title: '通讯异常',
                content: '请稍后重试',
                showCancel: false
            })
              return
          } 

            typeof callback == "function" && callback(res, "");
        },
        fail: (err) => {
            if (boo) {
                wx.hideLoading()
            }
            wx.showModal({
                title: '通讯异常',
                content: '请稍后重试',
                showCancel: false
            })
            console.log(err,"请求发送，后台未接受")
            
        }
    });
}

function getJSON(url, data, callback) {
    api('GET', url, data, callback)
}

function postJSON(url, data, callback) {
    api('POST', url, data, callback)
}

module.exports = {
    getJSON: getJSON,
    postJSON: postJSON
}

注意事项：
1、注意在请求失败提示框后添加return，否则即使调取失败仍然后执行代码；
2、判断条件根据后台实际返回情况进行判断；