• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    迪恩网络公众号

微信小程序之请求函数封装

原作者: [db:作者] 来自: [db:来源] 收藏 邀请
封装的request的代码
/**
 * @desc    API请求接口类封装
 */
/**
 * POST请求API
 * @param  {String}   url         接口地址
 * @param  {Object}   params      请求的参数
 * @param  {Object}   sourceObj   来源对象
 * @param  {Function} successFun  接口调用成功返回的回调函数
 * @param  {Function} failFun     接口调用失败的回调函数
 * @param  {Function} completeFun 接口调用结束的回调函数(调用成功、失败都会执行)
 */
function requestPostApi(url, params, sourceObj, successFun, failFun, completeFun) {
    requestApi(url, params, 'POST', sourceObj, successFun, failFun, completeFun)
}
/**
 * GET请求API
 * @param  {String}   url         接口地址
 * @param  {Object}   params      请求的参数
 * @param  {Object}   sourceObj   来源对象
 * @param  {Function} successFun  接口调用成功返回的回调函数
 * @param  {Function} failFun     接口调用失败的回调函数
 * @param  {Function} completeFun 接口调用结束的回调函数(调用成功、失败都会执行)
 */
function requestGetApi(url, params, sourceObj, successFun, failFun, completeFun) {
    requestApi(url, params, 'GET', sourceObj, successFun, failFun, completeFun)
}
/**
 * 请求API
 * @param  {String}   url         接口地址
 * @param  {Object}   params      请求的参数
 * @param  {String}   method      请求类型
 * @param  {Object}   sourceObj   来源对象
 * @param  {Function} successFun  接口调用成功返回的回调函数
 * @param  {Function} failFun     接口调用失败的回调函数
 * @param  {Function} completeFun 接口调用结束的回调函数(调用成功、失败都会执行)
 */
function requestApi(url, params, method, sourceObj, successFun, failFun, completeFun) {
    if (method == 'POST') {
        var contentType = 'application/x-www-form-urlencoded'
    } else {
        var contentType = 'application/json'
    }
    wx.request({
        url:    url,
        method: method,
        data:   params,
        header: {'Content-Type': contentType},
        success: function (res) {
            typeof successFun  == 'function' && successFun(res.data, sourceObj)
        },
        fail: function (res) {
            typeof failFun     == 'function' && failFun(res.data, sourceObj)
        },
        complete: function (res) {
            typeof completeFun == 'function' && completeFun(res.data, sourceObj)
        }
    })
}
module.exports = { 
    requestPostApi,
    requestGetApi
}
使用第一步

在app.js中引入封装的文件const request = require(‘./utils/request.js’) ,然后定义接口域名apiUrl: ‘https://www.geekxz.com‘,

/**
 * @desc    简单API请求示例
 */
const request = require('./utils/request.js')
App({
  request: request,
  getUserInfo:function(cb){
    var that = this
    if(this.globalData.userInfo){
      typeof cb == "function" && cb(this.globalData.userInfo)
    }else{
      //调用登录接口
      wx.login({
        success: function () {
          wx.getUserInfo({
            success: function (res) {
              that.globalData.userInfo = res.userInfo
              typeof cb == "function" && cb(that.globalData.userInfo)
            }
          })
        }
      })
    }
  },
  /**
   * 定义的接口域名
   */
  apiUrl: 'https://www.geekxz.com',
  globalData:{
    userInfo:null
  }
})
调用封装好的方法
var app = getApp()
Page({
  /**
   * 存储页面数据
   */
  data: {
      expressData : {},
  },
  /**
   * 接口调用成功处理
   */
  successFun: function(res, selfObj) {
      selfObj.setData({
          expressData : res,
      })
  },
  /**
   * 接口调用失败处理
   */
  failFun: function(res, selfObj) {
      console.log('failFun', res)
  },
  /**
   * 页面加载时初始化数据
   */
  onLoad: function() {
      var url     = app.apiUrl+'/query'
      var params  = {
          type   : 'zhongtong',
          postid : '424621263550',
      }
      //@todo 网络请求API数据
      app.request.requestGetApi(url, params, this, this.successFun, this.failFun)
  }
})

.


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
获取远程图片很慢到解决方法,支付宝小程序二维码获取发布时间:2022-07-22
下一篇:
微信小程序功能函数密码验证*发布时间:2022-07-22
热门推荐
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap