微信小程序 之 请求函数封装
封装的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)
}
})
.
微信小程序 之 请求函数封装的更多相关文章
- 微信小程序request请求的封装
目录 1,前言 2,实现思路 3,实现过程 3.1,request的封装 3.2,api的封装 4,实际使用 1,前言 在开发微信小程序的过程中,避免不了和服务端请求数据,微信小程序给我们提供了wx. ...
- mpvue学习笔记-之微信小程序数据请求封装
简介 美团出品的mpvue已经开源出来很久了,一直说要进行一次实践,这不最近一次个人小程序开发就用上了它. 看了微信官方的数据请求模块--request,对比了下get和post请求的代码,发现如果在 ...
- 微信小程序数据请求方法wx.request小测试
微信小程序数据请求方法 wx.request wxml文件: <view> <textarea value="{{textdata}}"/> </vi ...
- 微信小程序POST请求参数传递不到后台, 前台获取不到后端返回的数据, 以及 post 请求返回 404 但后台能收到数据
1 微信小程序POST请求参数传递不到后台 需要在微信请求 wx.request 改变默认 header 配置为如下 wx.request({ url: 'test.php', //仅为示例,并非真实 ...
- 微信小程序 网络请求之re.request 和那些坑
微信小程序有四种网络请求类型,下面只详细介绍普通HTTPS请求(wx.request) 普通HTTPS请求(wx.request) 上传文件(wx.uploadFile) 下载文件(wx.downlo ...
- 微信小程序 -- 数据请求
微信小程序 -- 数据请求 微信小程序请求数据,并不是一个可以在url打开有数据就可以拿到数据那么简单 浏览器地址输入 可以获取参数的url 微信小程序中 代码展示 wxml <view> ...
- 微信小程序跳转函数总结
微信小程序跳转函数总结 笔者在微信小程序前端的开发过程中,在不同的情况下遇到了需要使用不同的页面跳转逻辑的情况,以下是我对这些函数的使用场景的一个总结介绍. wx.navigateTo 这是最常用 ...
- 让微信小程序每次请求的时候不改变session_id的方法
让微信小程序每次请求的时候不改变session_id的方法 每次微信小程序请求的时候都会改变session id, 还好他的请求方法内可以设置header头 所以只需要在启动程序后第一次请求服务器获得 ...
- 微信小程序开发——使用promise封装异步请求
前言: 有在学vue的网友问如何封装网络请求,这里以正在写的小程序为例,做一个小程序的请求封装. 关于小程序发起 HTTPS 网络请求的Api,详情可以参考官方文档:wx.request(Object ...
随机推荐
- wp检测是否是手机网络还是wifi网络
原文发布时间为:2013-06-22 -- 来源于本人的百度文章 [由搬家工具导入] ),newNameResolutionCallback(handle =>{NetworkInterface ...
- win8.1 安装sql2008 启动报错.net framework 应用程序的组件中发生了异常unable to read the previous list
解决方案:删除 RegSrvr.xml C:\Documents and Settings\Administrator\Application Data\Microsoft\Microsoft SQL ...
- vue 项目 webstrom IDE格式化代码规则遵循eslint设置
首先vue-cli生成了一个项目,开启了eslint的检测, 但是根据webstorm的快捷格式化代码 ctrl+alt+L会造成eslint报错. 解决办法一: 编辑器打开文件 首先,在编辑器里面要 ...
- 在eclipse中使用vim
转自:http://blog.csdn.net/eplaylity/article/details/6168283 1. vrapper(开源) 直接从eclipse安装即可,地址:http://vr ...
- js继承的实现
js继承有5种实现方式: 1.继承第一种方式:对象冒充 function Parent(username){ this.username = username; this.hell ...
- 使用Vagrant打造Linux开发环境
1.安装Oracle VM VirtualBox.vagrant,安装完成需重启电脑 Oracle VM VirtualBox安装包下载:https://www.virtualbox.org/wiki ...
- AC日记——Sliding Window poj 2823
2823 思路: 单调队列: 以前遇到都是用线段树水过: 现在为了优化dp不得不学习单调队列了: 代码: #include <cstdio> #include <cstring> ...
- J.U.C并发框架源码阅读(七)CyclicBarrier
基于版本jdk1.7.0_80 java.util.concurrent.CyclicBarrier 代码如下 /* * ORACLE PROPRIETARY/CONFIDENTIAL. Use is ...
- 洛谷 P1060 开心的金明【DP/01背包】
题目描述 金明今天很开心,家里购置的新房就要领钥匙了,新房里有一间他自己专用的很宽敞的房间.更让他高兴的是,妈妈昨天对他说:"你的房间需要购买哪些物品,怎么布置,你说了算,只要不超过N元钱就 ...
- Wannafly挑战赛10 D 小H的询问(线段树)
题目链接 Problem D 这个题类似 SPOJ GSS3 做过那个题之后其实就可以秒掉这题了. 考虑当前线段树维护的结点 在那道题的基础上,这个题要多维护几个东西,大概就是左端点的奇偶性,右端点 ...