最近准备转到uniapp上,所以比较关注他的支付功能,今天花了一个下午的时间写了个demo,坑还比较多的,差点放弃了,好在最后一一解决了...记录下以防下次用的时候忘记了
第一步做个按钮:
支付
第一步要获得用户的code,用code换取openid,uni.login({provider:'weixin',success(code){console.log('code:',code.code)}})
第二步用code 换取 openid ,这个实现起来比较复杂,好在官方给我们封装好了,我们建立一个云函数取名 getOpenid,内容如下'use strict';const uniID = require('uni-id')exports.main = async function(event,context) { const res = await uniID.code2SessionWeixin({ code: event.code }) return res}
注意这个云函数里用了官方uni-id插件,我们需要安装下这个插件,插件地址不让放,自己去插件市场搜索安装吧
这里要特别说明下
1:导入后 需要配置 common/uni-id/config.json里的mp-weixin项目中的appid和appSecret,然后右键上传部署
2: 然后到 getOpenid函数上,右键,使用命令行窗口打开目录 执行 npm install ../common/uni-id 这样他们就有了依赖关
我本人在这里绕了很长时间,官方也没有说明,这里很坑,我是去翻阅源码,看见源码里有提示才知道的...
第三步:在本地调用云函数获取openiduniCloud.callFunction({ name: 'getOpenid', data: { code: code.code } }).then(openid => { console.log('openid:', openid.result.openid)})
第四步:有了openid就可以准备统一下单了,继续建立云函数getOrderInfo'use strict'; const unipay = require('unipay') const unipayIns = unipay.initWeixin({ appId: '1111',//小程序appid mchId: '2222',//微信商户号 key: '333333', //商户号的API密钥 //pfx: fs.readFileSync('/path/to/your/pfxfile'), // p12文件路径，使用微信退款时需要，需要注意的是阿里云目前不支持以相对路径读取文件，请使用绝对路径的形式 }) exports.main = async (event, context) => { //event为客户端上传的参数 let orderInfo = await unipayIns.getOrderInfo({ openid: event.openid, //这个是客户端上传的用户的openid subject: '订单标题', // 微信支付时不可填写此项 body: '商品描述', outTradeNo: '12567fgfghxtdfgdgdgdgdgx', totalFee: 1, // 金额，单位分 notifyUrl: 'https://xxx.xx' // 支付结果通知地址 }) return { orderInfo } };
这里用到了官方封装的unipay插件,老规矩在插件市场安装后,在commom下多了个unipay目录,
回到 getOrderInfo云函数,右键,使用命令行窗口打开目录 执行 npm install ../common/unipay 这样他们就有了依赖关
做到这里他们就可以正常调起收银台了,如果不能正常的,请注意是否上传了云函数
这里我把客户端的代码上传,由于是测试的就直接嵌套了,勿喷!
支付
export default { data() { return { } }, methods: { getCode() { // 获取支付的信息 // uni.getProvider({ // service: 'payment', // success: function (res) { // console.log(res) // if (~res.provider.indexOf('wxpay')) { // uni.login({ // provider: 'wxpay', // success: function (loginRes) { // console.log(JSON.stringify(loginRes)); // } // }); // } // } // }); //this.wxPay() //1:获得code uni.login({ provider: 'weixin', success(code) { console.log('code:', code.code) //2:获得openid uniCloud.callFunction({ name: 'getOpenid', data: { code: code.code } }).then(openid => { console.log('openid:', openid.result.openid) //3:統一下單 uniCloud.callFunction({ name: 'getOrderInfo', data: { openid: openid.result.openid } }).then(order => { console.log('OrderInfo:', order) uni.requestPayment({ // #ifdef MP-WEIXIN ...order.result.orderInfo, // #endif success() {}, fail() {} }) }) }) }, fail(err) { reject(new Error('微信登录失败')) } }) }, wxPay() { uni.requestPayment({ provider: 'wxpay', timeStamp: String(Date.now()), //时间戳 nonceStr: 'A1B2C3D4E5', //随机字符串，长度为32个字符以下。 package: 'prepay_id=wx20180101abcdefg', //统一下单接口返回的 prepay_id 参数值，提交格式如：prepay_id=xx signType: 'MD5', //签名算法，暂支持 MD5 paySign: '', success: function(res) { console.log('success:' + JSON.stringify(res)); }, fail: function(err) { console.log('fail:' + JSON.stringify(err)); } }); } } }
