100字范文,内容丰富有趣,生活中的好帮手!
100字范文 > 微信公众号 网页支付的实现

微信公众号 网页支付的实现

时间:2020-03-20 02:33:02

相关推荐

微信公众号 网页支付的实现

1、支付js引用添加

<script src="http://res2./open/js/jweixin-1.4.0.js"></script>

2、具体的实现流程:

1.首先获取到支付订单号

2.根据支付订单号获取支付参数

3.通过JavaScript调用getBrandWCPayRequest接口,发起微信支付请求,用户进入支付流程

4.用户成功支付点击完成按钮后,商户的前端会收到JavaScript的返回值。商户可直接跳转到支付成功的静态页面进行展示。

5.商户后台收到来自微信开放平台的支付成功回调通知,标志该笔订单支付成功。

3、支付实例

//假设用户进行充值

async chargeClick() {if (!this.validaPhone()) return;if (!this.userName) {this.$toast('请输入会员姓名');return;}if (!this.cashMoney || isNaN(this.cashMoney) || this.cashMoney <= 0) {this.$toast('请输入正确金额');return;}if ((this.cashMoney + '').split('.')[1] && (this.cashMoney + '').split('.')[1].length > 2) {this.$toast('金额最多输入两位小数');return;}let data = {ShopNo: this.shopId, // 门店编号,Name: this.userName, //会员姓名,Phone: this.userPhone, //手机号,RechargeMoney: +this.cashMoney //充值金额};let res = await customerRecharge(data);if (res.IsSuccess) {this.getPayParams(res.Result.OuterMiJiRechargeOrderNo);}},//通过支付订单号获取支付参数async getPayParams(orderNo) {const params = {M: false,OrderNo: orderNo};let res = await getwxjsapiparam(params);if (res.IsSuccess) {this.appParams = res.Result;this.initPay();}},//获取到支付参数后调用微信支付api 进行支付initPay() {if (typeof WeixinJSBridge == 'undefined') {if (document.addEventListener) {document.addEventListener('WeixinJSBridgeReady', this.onBridgeReady, false);} else if (document.attachEvent) {document.attachEvent('WeixinJSBridgeReady', this.onBridgeReady);document.attachEvent('onWeixinJSBridgeReady', this.onBridgeReady);}} else {this.onBridgeReady();}},onBridgeReady() {const that = this;WeixinJSBridge.invoke('getBrandWCPayRequest', this.appParams, function(res) {var msg = res.err_msg.split(':')[1];if (msg === 'ok') {// that.$toast('支付成功');that.$router.replace('/recharge/rechargeSuccess');} else if (msg === 'cancel') {that.$toast('用户取消支付');} else {that.$toast(msg);}});},

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。