封装的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)
}
})

.

微信小程序 之 请求函数封装的更多相关文章

  1. 微信小程序request请求的封装

    目录 1,前言 2,实现思路 3,实现过程 3.1,request的封装 3.2,api的封装 4,实际使用 1,前言 在开发微信小程序的过程中,避免不了和服务端请求数据,微信小程序给我们提供了wx. ...

  2. mpvue学习笔记-之微信小程序数据请求封装

    简介 美团出品的mpvue已经开源出来很久了,一直说要进行一次实践,这不最近一次个人小程序开发就用上了它. 看了微信官方的数据请求模块--request,对比了下get和post请求的代码,发现如果在 ...

  3. 微信小程序数据请求方法wx.request小测试

    微信小程序数据请求方法 wx.request wxml文件: <view> <textarea value="{{textdata}}"/> </vi ...

  4. 微信小程序POST请求参数传递不到后台, 前台获取不到后端返回的数据, 以及 post 请求返回 404 但后台能收到数据

    1 微信小程序POST请求参数传递不到后台 需要在微信请求 wx.request 改变默认 header 配置为如下 wx.request({ url: 'test.php', //仅为示例,并非真实 ...

  5. 微信小程序 网络请求之re.request 和那些坑

    微信小程序有四种网络请求类型,下面只详细介绍普通HTTPS请求(wx.request) 普通HTTPS请求(wx.request) 上传文件(wx.uploadFile) 下载文件(wx.downlo ...

  6. 微信小程序 -- 数据请求

    微信小程序 -- 数据请求 微信小程序请求数据,并不是一个可以在url打开有数据就可以拿到数据那么简单 浏览器地址输入 可以获取参数的url 微信小程序中 代码展示 wxml <view> ...

  7. 微信小程序跳转函数总结

    微信小程序跳转函数总结 ​ 笔者在微信小程序前端的开发过程中,在不同的情况下遇到了需要使用不同的页面跳转逻辑的情况,以下是我对这些函数的使用场景的一个总结介绍. wx.navigateTo 这是最常用 ...

  8. 让微信小程序每次请求的时候不改变session_id的方法

    让微信小程序每次请求的时候不改变session_id的方法 每次微信小程序请求的时候都会改变session id, 还好他的请求方法内可以设置header头 所以只需要在启动程序后第一次请求服务器获得 ...

  9. 微信小程序开发——使用promise封装异步请求

    前言: 有在学vue的网友问如何封装网络请求,这里以正在写的小程序为例,做一个小程序的请求封装. 关于小程序发起 HTTPS 网络请求的Api,详情可以参考官方文档:wx.request(Object ...

随机推荐

  1. matlab 分析wav波形

    [x,fs,bits]=wavread('d.wav', [1 5000]); % sound(x, fs, bits); N = length(x); n = 0 : N-1; t = n/fs; ...

  2. c中结构体的4种定义

    1.常规的标准方式: 1 #include <stdio.h>  2   3 struct student{  4     int age;  5     float score;  6 ...

  3. 戴文的Linux内核专题:02 源代码【转】

    转自:https://linux.cn/article-2190-1.html?pr 在下载并解压内核源代码后,用户可以看到许多文件夹和文件.尝试去找一个特定的文件或许是一个挑战.谢天谢地,源代码以一 ...

  4. c/c++类型转换相关总结

    在c语言中存在两种类型转换:显式类型转换和隐式类型转换: 显示类型转换:在类型前加上(type)变量,对变量进行的转换,程序员自己显式添加: char *ptra = (char*)ptrb; voi ...

  5. Java HotSpot(TM) 64-Bit Server VM warning: Insufficient space for shared memory file: /tmp/hsperfdata_hadoop/44512

    早上登录hbase shell,出现异常: [hadoop@node002 ~]$ hbase shell Java HotSpot(TM) 64-Bit Server VM warning: Ins ...

  6. [BZOJ1069][SCOI2007]最大土地面积 凸包+旋转卡壳

    1069: [SCOI2007]最大土地面积 Time Limit: 1 Sec  Memory Limit: 128 MBSubmit: 3669  Solved: 1451[Submit][Sta ...

  7. AC日记——Little Elephant and Shifts codeforces 221e

    E - Little Elephant and Shifts 思路: 一次函数线段树(疯狂debug): b不断循环左移,判断每次最小的|i-j|,a[i]=b[j]: 仔细观察发现,每个bi移动时, ...

  8. elasticsearch配置文件(elasticsearch.yml)详解

    来自:http://www.searchtech.pro/articles/2013/02/18/1361194291548.html elasticsearch的config文件夹里面有两个配置文 ...

  9. Wannafly挑战赛22 A-计数器(gcd,裴蜀定理)

    原题地址 题目描述 有一个计数器,计数器的初始值为0,每次操作你可以把计数器的值加上a1,a2,...,an中的任意一个整数,操作次数不限(可以为0次),问计数器的值对m取模后有几种可能. 输入描述: ...

  10. 【bzoj3687】【简单题】bitset

    [pixiv] https://www.pixiv.net/member_illust.php?mode=medium&illust_id=64333782 这次的图是自己画的,方便的话点个赞 ...