专注连锁门店会员营销管理系统
线上+线下+进销存+收银+会员2020-09-27 作者:秩名
这里为大家介绍微信小程序api拦截器,微信小程序api拦截器完美兼容原生小程序项目完美兼用小程序api的原本调用方式。
npm install wxapp-api-interceptors --save 使用 mpvue等项目
import wxApiInterceptors from 'wxapp-api-interceptors'; wxApiInterceptors(); // 必须在调用小程序api之前调用 原生小程序项目
下载该项目,解压移动文件夹dist里wxApiInterceptors.js和runtime.js文件到你自己的项目,详见示例。
const wxApiInterceptors = require('./wxApiInterceptors'); wxApiInterceptors(); // 必须在调用小程序api之前调用 小程序api调用
不必传success、complete和fail参数。
函数式异步调用方式:
wx.showLoading({title: '登录中...'}) .then(wx.login) .then(data => wx.request.post('/login', {data})) .then(() => wx.showToast({title: '登录成功'})) .catch(() => wx.showToast({title: '登录失败'})) .finally(wx.hideLoading); 也兼容原生的调用方式(不便维护):
wx.showLoading({ title: '登录中...', success: () => { wx.login({ success: (data) => { wx.request({ url: '/login', data, success: () => wx.showToast({title: '登录成功'}), fail: () => wx.showToast({title: '登录失败'}), complete: wx.hideLoading, }); }, }); }, }); 自定义拦截器
使用方法及参数:wxApiInterceptors({[api]: {[request](params):params, [response](res):res}})
比如拦截wx.showModal的confirmColor默认值为red,调用成功后并拦截调用成功返回的结果。
wxApiInterceptors({ showModal: { request(params) { if (params.confirmColor === undefined) { params.confirmColor = 'red'; } return params; }, response(res) { res = '调用成功'; return res; }, } }); wx.showModal({title: '测试'}) .then(console.log); // 控制的输出:调用成功 默认拦截了request api,封装成了和axios差不多的使用方式
调用wx.request[method](url, [config])发送axios化的请求。
默认GET请求
wx.request('https://test.com/banner') .then(({data}) => { console.log(data); }) 其他请求方式
wx.request.post('https://test.com', {data: {userName: 'test'}}) .then(({data}) => { console.log(data); }) 当然也可以再继续拦截request api
比如设置request api默认的host:
wxApiInterceptors({ request: { request(params) { const host = 'https://test.com' if (!/^(http|\/\/)/.test(params.url)) { params.url = host + params.url; } return params; }, }, });
甚至可以拦截自己的业务状态码:
wxApiInterceptors({ request: { response(res) { const {data: {code}} = res; // 如果data里的code等于-1就响应为失败 if (code === -1) { return Promise.reject(res); } return res; }, }, }); 强大的async拦截器
比如调用request api的时候都在header里带上本地储存的token,没有的话从服务器获取:
wxApiInterceptors({ request: { async request(params) { if (params.header === undefined) { params.header = {}; } let token = wx.getStorageSync('token'); if (!token) { ({data: token} = await wx.request('/getToken')); wx.setStorageSync('token', token); } params.header.token = token; return params; }, }, });
线上+线下+进销存+收银+会员门店零售管理好帮手
门店能实现快速收银,提升门店经营效率。
系统自带进销存管理,更好管理库存销售。
配备收银硬件一站式整体服务。
收 银 会员管理 库存管理 商品管理 交接班 数据报表 营销促单 售后处理 多种收款
获取报价推荐文章
微信小程序能够很好连接线下商户与用户之间的关系,并将线上用户有效引流到线下门店,那么对于商户来说,需要如何添加...
如何获得好的运营效益,是微信支付团队和商户共同关心的“商业秘籍”。 在刚刚结束的2018年微信支付成长计划服务商大会...
在微信,如何让用户更便捷地找到你的服务?一搜即可。 今天, 微信“功能直达” 正式开放 ,商家与用户的距离可以更“...
针对部分小程序跳转中暴露出的问题,微信表示将弥补小程序跳转上的缺陷,调整相关规则。具体措施如下:...
分销裂变是什么 分销裂变模式是一种基于社交关系网络的营销模式,借助互联网社交工具,实现商品或服务的推广与销售增...
分销系统小程序需包含哪些核心模块? 分销系统小程序是借助社交关系链实现产品推广与销售的工具,其核心模块的设计直接...
小程序商城vs微商城,功能、体验的对比 在数字化商业浪潮中,微商城和小程序商城已成为商家开拓线上业务的热门选择。二...
如何从0到1做分销?90%品牌在用的裂变模式 分销,简单说就是品牌或商家通过发展分销者,让他们利用自身资源推广产品,达...
5种常见的小程序类型,看看你适合做哪种 小程序类型商城是一种基于小程序平台的在线购物系统,它让商家能通过小程序为...
分销小程序的6大主流模式推荐 分销小程序,是基于微信小程序开发的电商解决方案,借助微信庞大用户基础,商家将商品推...