技术笔记:uniapp微信小程序支付

简介: 技术笔记:uniapp微信小程序支付

完全依赖后台接口实现


      submit(){


var self = this;


// console.log(this.price,this.payType)


var money = 100000;


var amount = this.price;


var payType = this.payType;


if (amount == "" || amount == null ) {


uni.showToast({


title: "请填写充值金额",//代码效果参考:http://www.jhylw.com.cn/571930553.html


icon:"none",


duration: 2000


});


this.priFocus = true


return


}


if (amount <= 0) {


uni.showToast({


title: "请填写正确的金额",


icon:"none",


duration: 2000


});


this.price = '';


this.priFocus = true


return


}


if (amount > money) {


uni.showToast({


title: "充值金额过大",


icon:"none",


duration: 2000


});


this.priFocus = true


return


}


if (payType == "" || payType == null || !payType) {


uni.showToast({


title: "请选择支付方式",


icon:"none",


duration: 2000


});


return


}


let obj = {}


obj.Amount = amount //充值金额


obj.Pay_Type = payType //类型


//因为是充值所以先请求接口生成一个订单号,存到this.invest_money_inpourno,再发支付接口,【如果是购物车或者直接购买支付,已经有订单号了,就不要需要这步,直接到invest_money_paymode()判断openid】


uni.request({


url: this.$httpUrl.OnlineInpourAdd,


method: 'POST',


data: JSON.stringify(obj),


header:{


'token':this.$utils.getToken(),


},


success: (res) => {


if(res.data.s.co === -100){


this.$utils.logBackIn(res.data.s.co,this)


}else if (res.data.s.co === 1) {


// let info = res.data.d.rd


this.invest_money_inpourno = res.data.o //得到后台返回的订单号


this.invest_money_paymode();


// this.$nextTick(() => {


// })


} else {


uni.showToast({


title: res.data.s.mg,


icon: "none",


duration: 2000


});


}


}


})


},


invest_money_paymode(){


var self = this;


let obj = {}


var payType = this.payType;


if (payType == 2) {


//小程序支付


//JSON


// {


// "mchid": "1900006XXX",直连商户号


// "out_trade_no": "1217752501201407033233368318",商户订单号


// "appid": "wxdace645e0bc2cXXX",应用ID


// "notify_url": "",通知地址


// "amount": {订单金额


// "total": 1,总金额


// "currency": "CNY"货币类型


// },


// "payer": {支付者


// "openid": "o4GgauInH_RCEdvrrNGrntXDuXXX"用户标识


// }


// }


// console.log(this.openid,this.invest_money_inpourno)


if(this.openid == ''){


wx.login({


success (res) {


// console.log(res)


//这里this需要self


if (res.code) {


//发起网络请求,拿到code去请求接口


uni.request({


url: self.$httpUrl.GetOpenIDByCode,


method: 'POST',


data: {


'': res.code


},


header:{


'Content-Type': 'application/x-www-form-urlencoded',


'token':self.$utils.getToken(),


},


success: (res) => {


// console.log(res)


if (res.data.s.co === 1) {


// let info = res.data.d.rd


self.openid = res.data.s.smg //这里后台返回openid


//并放入缓存中


                        uni.setStorage({


key: 'Myopenid',


data: self.openid


})


//拿4个值发支付请求


self.weixinzhifu()


// self.$nextTick(() => {


// })


} else {


uni.showToast({


title: res.data.s.mg,


icon: "none",


duration: 2000


});


}


}


})


} else {


uni.showToast({


title: '登录失败!' + res.errMsg,


icon: "none",


duration: 2000


});


}


}


})


}else{


//有openid


self.weixinzhifu()


}


}


},


weixinzhifu(){


var self = this


var obj = {}


obj.Tid = this.invest_money_inpourno//订单号


obj.payWhere = 1//充值支付


obj.openid = this.openid//openid


obj.total = this.price//金额


uni.request({


url: this.$httpUrl.UnifiedOrder,


method: 'POST',


data: JSON.stringify(obj),


header:{


'token':this.$utils.getToken(),


},


success: (res) => {


// console.log(res)


if (res.data.s.co === 1) {


let info = res.data.o


wx.requestPayment


(


{


"timeStamp": info.timeStamp,


"nonceStr": info.nonceStr,


"package": info.package,


"signType": "MD5",


"paySign": info.paySign,


"success":function(res){


//支付成功跳转页面


// self.$Router.push


self.$Router.replace({


name:'accountBalance'


})


},


"fail":function(res){


                        //支付失败弹提示


uni.showToast({


title: res.errMsg,


icon: "none",


duration: 2000


});


},


"complete":function(res){}


}


)


} else {


uni.showToast({


title: res.data.s.mg,


icon: "none",


duration: 2000


});


}


}


})


}

相关文章
|
5天前
|
JavaScript Java 测试技术
基于SpringBoot+Vue+uniapp的智慧农业小程序的详细设计和实现(源码+lw+部署文档+讲解等)
基于SpringBoot+Vue+uniapp的智慧农业小程序的详细设计和实现(源码+lw+部署文档+讲解等)
20 6
|
5天前
|
JavaScript Java 测试技术
基于SpringBoot+Vue+uniapp的在线答题微信小程序的详细设计和实现(源码+lw+部署文档+讲解等)
基于SpringBoot+Vue+uniapp的在线答题微信小程序的详细设计和实现(源码+lw+部署文档+讲解等)
19 3
|
2天前
|
JavaScript Java 测试技术
基于SpringBoot+Vue+uniapp的宠物咖小程序的详细设计和实现(源码+lw+部署文档+讲解等)
基于SpringBoot+Vue+uniapp的宠物咖小程序的详细设计和实现(源码+lw+部署文档+讲解等)
3 0
|
3天前
|
XML 小程序 前端开发
技术心得记录:微信小程序开发的基本流程
技术心得记录:微信小程序开发的基本流程
|
3天前
|
小程序 API
技术心得记录:微信小程序之图片频繁变化,几秒之后输出结果(适用于抽奖)
技术心得记录:微信小程序之图片频繁变化,几秒之后输出结果(适用于抽奖)
|
11天前
|
JavaScript Java 测试技术
基于SpringBoot+Vue+uniapp的外卖程序的详细设计和实现(源码+lw+部署文档+讲解等)
基于SpringBoot+Vue+uniapp的外卖程序的详细设计和实现(源码+lw+部署文档+讲解等)
|
11天前
|
JavaScript Java 测试技术
基于SpringBoot+Vue+uniapp的高校订餐系统的详细设计和实现(源码+lw+部署文档+讲解等)
基于SpringBoot+Vue+uniapp的高校订餐系统的详细设计和实现(源码+lw+部署文档+讲解等)
|
11天前
|
JavaScript Java 测试技术
基于SpringBoot+Vue+uniapp的点餐系统的详细设计和实现(源码+lw+部署文档+讲解等)
基于SpringBoot+Vue+uniapp的点餐系统的详细设计和实现(源码+lw+部署文档+讲解等)
|
11天前
|
JavaScript Java 测试技术
基于SpringBoot+Vue+uniapp的小程序疫苗预约网站系统的详细设计和实现(源码+lw+部署文档+讲解等)
基于SpringBoot+Vue+uniapp的小程序疫苗预约网站系统的详细设计和实现(源码+lw+部署文档+讲解等)
|
2天前
|
JavaScript Java 测试技术
基于SpringBoot+Vue+uniapp的食品安全信息管理系统的详细设计和实现(源码+lw+部署文档+讲解等)
基于SpringBoot+Vue+uniapp的食品安全信息管理系统的详细设计和实现(源码+lw+部署文档+讲解等)
17 2