小程序封装接口请求
Posted 日升月恒
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了小程序封装接口请求相关的知识,希望对你有一定的参考价值。
config.js里引入封装接口 /** * 小程序配置文件 */ // 此处主机域名是腾讯云解决方案分配的域名 // var HOST_TEST1 = "https://icpmotes/mobile"//测试环境: var HOST_TEST1 = "https://wxwx.com:443/api-test-xiaop/virtualcurrency-manage-wx"; //本地环境 var HOST_TEST2 = "https://wxwx.com:443/api-test/virtualcurrency-manage-wx"; //测试环境 var HOST_TEST3 = "https://wxwx.com:443/api/virtualcurrency-manage-wx"; //生产环境 var HOST = HOST_TEST1; let wxContext = "virtualcurrency-manage-wx" var config = { //*ICP计划运营小程序接口* // userLogin: `${HOST}/member/login.htm`,//用户登录 userLogin: `${HOST}/account/login`,//用户登录 checkAccount: `${HOST}/account/checkAccount`,//切换账户 userCheck: `${HOST}/member/check.htm`,//权限验证 myNodeData: `${HOST}/node/data.htm`,//我的节点 goBackH: function () {// 返回上一页 let timer = setTimeout(function () { let pages = getCurrentPages();//页面栈 let currPage = pages[pages.length - 1]; //当前页面 let prevPage = pages[pages.length - 2]; //上一个页面 wx.navigateBack({ delta: 1 }) }, 2000) }, goBack: function () {// 返回上一页并刷新上一页数据 let timer = setTimeout(function () { let pages = getCurrentPages();//页面栈 let currPage = pages[pages.length - 1]; //当前页面 let prevPage = pages[pages.length - 2]; //上一个页面 prevPage.upPageData();//直接调用上一个页面的方法刷新 wx.navigateBack({ delta: 1 }) }, 2000) }, upLoadPerPage: function () {//不返回上一页 但是刷新上一页 let pages = getCurrentPages();//页面栈 let currPage = pages[pages.length - 1]; //当前页面 let prevPage = pages[pages.length - 2]; //上一个页面 prevPage.upPageData();//直接调用上一个页面的方法刷新 } }; module.exports = config
http.js页面封装请求 const request = { buildHeader(){ return { ‘content-type‘: ‘application/x-www-form-urlencoded‘ }; }, // 将接口参数和公共参数合并 buildParams(params) { // const uToken = wx.getStorageSync(‘uToken‘); const baseParams = { // uToken: wx.getStorageSync(‘uToken‘) // 系统分配的用户ID accountId: wx.getStorageSync(‘virtualUserID‘) || null }; return Object.assign({}, baseParams, params); }, // 普通post请求 post(url, params, isToken = false) { // isToken 登录接口不需要uToken const header = this.buildHeader(); // const data = params; const data = isToken ? params : this.buildParams(params); // console.log(‘url‘,url,data) wx.showLoading({ title: ‘加载中‘, }) return new Promise((resolve, reject) => { wx.request({ url: isToken ? url : `${url}?uToken=${wx.getStorageSync(‘uToken‘)}`, method: ‘POST‘, data, // header, success(res) { // console.log(‘request-promise‘, res); if(res.statusCode === 200) { if(res.data.returnResult !== 200) { wx.showToast({ title: (res.data.returnModelInfo || {}).message || res.data.returnDetail || ‘服务器内部错误‘, icon: ‘none‘, duration: 2000 }) } resolve(res.data); } else { reject(res.errMsg); } wx.hideLoading(); }, fail(error) { // console.log(‘error‘,error) wx.showToast({ title: ‘服务器内部错误‘, icon: ‘none‘, duration: 1500 }) reject(error); }, complete() { // setTimeout(() => { // wx.hideLoading(); // },1000) } }) }) } }; export default request;
//app.js 绑定到实例上 import request from ‘./https/request-promise‘; const config = require(‘./config‘); App({ onLaunch: function () { const originalPage = Page; // console.log(‘Page‘,Page) Page = function(pageObj) { pageObj.$request = request; pageObj.$config = config; return originalPage(pageObj); }; this.$request = request; this.$config = config; } })
页面调用接口 const app = getApp() // 公共的列表接口 _requestPageListCom(url=“userLogin”, params, callback) {
let opt = Object.assign({}, params, { pageData: { pageNo: this.data.pageNo, //页码 pageSize: 10 //每页请求的条数 }, }) app.$request.post(app.$config[url], opt).then(res => { if (res.returnResult === 200) { const oldList = this.data.list const newGoodsList = res.returnData.data const nList = [...oldList, ...newGoodsList] let newData = {}; //新变更数据 for(let i in nList){ newData[‘list[‘+i+‘]‘] = nList[i] } this.setData(newData);//赋值列表数据 this.setData({ recordCount: res.returnData.recordCount }) if(callback && typeof callback === ‘function‘){ callback() } } }) },
以上是关于小程序封装接口请求的主要内容,如果未能解决你的问题,请参考以下文章