uniapp微信公众号支付
参考:https://pay.weixin.qq.com/wiki/doc/apiv3/apis/chapter3_1_4.shtmlhttps://developers.weixin.qq.com/community/pay/doc/000262a8478c682db6dac423156c00<template><view class="pay"><view cla
参考:
https://pay.weixin.qq.com/wiki/doc/apiv3/apis/chapter3_1_4.shtml
https://developers.weixin.qq.com/community/pay/doc/000262a8478c682db6dac423156c00
<template>
<view class="pay">
<view class="box">
<view class="grey3 f28 w100">支付金额</view>
<view class="money dis-flex">
<text class="moneyIcon">¥</text>
<input :value="moneyVal" disabled>
</view>
</view>
<NumKeypad fontSize="20px" @NumValue="GetNumValue" @submit="payHandle"></NumKeypad>
</view>
</view>
</template><script>
import NumKeypad from "./components/NumKeyPad.vue";
import {getOAuth,getJsApi} from '../../api/user.js'
export default {
components:{
NumKeypad
},
data() {
return {
moneyVal:'',
code:'',
state:'',
winUrl:'',
weixinList:'',
}
},
onLoad(options) {
this.getCode()
},
methods: {
getCode () { // 非静默授权,第一次有弹框
this.code = '';
const local = encodeURIComponent('https://gzh.yyecar.com/index.html'); // 获取页面url
const appid = '*******************';
this.code = this.getUrlParam('code'); // 截取code
this.state = this.getUrlParam('state'); // 截取code
console.log('state',this.state)
if (this.code == null || this.code === '' || this.code == undefined) { // 如果没有code,则去请求
window.location.href = `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${appid}&redirect_uri=${local}&response_type=code&scope=snsapi_base&state=STATE&connect_redirect=1#wechat_redirect`
}else {
getOAuth({code:this.code}).then(res=>{
console.log(res)
uni.setStorageSync("open_id",res.openid);
}).catch(err=>{
})
}
},
// 解析URL 参数
getUrlParam(name) {
let reg = new RegExp('(^|&)'+ name + '=([^&]*)(&|$)')
let r = window.location.search.substr(1).match(reg)
if(r!=null){
return unescape(r[2])
}
return null
},
payHandle(){
let openid = uni.getStorageSync('open_id')
let money = this.moneyVal
let storeKey = this.state
getJsApi({openid,money,storeKey}).then(res=>{
if(res.success==true){
let payment = {
appId: res.appId,
nonceStr: res.nonceStr,
package: res.package,
paySign: res.paySign,
timeStamp: res.timeStamp,
signType: "MD5",
}
this.weixinList = payment
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();
}
}
}).catch(err=>{
})
},
onBridgeReady() {
WeixinJSBridge.invoke('getBrandWCPayRequest', this.weixinList,res=> {
console.log('进入接口:',this.weixinList)
console.log('res:',res)
let obj = JSON.stringify(res)
console.log('返回介绍:',obj)
if (res.err_msg == "get_brand_wcpay_request:ok") {
WeixinJSBridge.call('closeWindow')
// WeixinJSBridge.invoke('closeWindow', {}, function (res) {})
// 使用以上方式判断前端返回,微信团队郑重提示:
//res.err_msg将在用户支付成功后返回ok,但并不保证它绝对可靠。
}
});
},
GetNumValue(value) {
this.moneyVal = value
}
}
}
</script>
开放原子开发者工作坊旨在鼓励更多人参与开源活动,与志同道合的开发者们相互交流开发经验、分享开发心得、获取前沿技术趋势。工作坊有多种形式的开发者活动,如meetup、训练营等,主打技术交流,干货满满,真诚地邀请各位开发者共同参与!
更多推荐
所有评论(0)