准备条件:公众号appid
uniapp开发H5需要调用公众号登录,以及公众号支付,支付看我上一篇文章,ios系统在H5是可以支付的。
代码:
/*微信登录相关 start*/
//方法:用来判断是否是微信内置的浏览器
isWechat() {
console.log('isWechat');
return String(navigator.userAgent.toLowerCase().match(/MicroMessenger/i)) === "micromessenger";
},
//方法:用来提取code
getUrlCode(name) {
console.log('getUrlCode', name);
return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.href) ||
[, ''
])[1]
.replace(/\+/g, '%20')) || null
},
//检查浏览器地址栏中微信接口返回的code
checkWeChatCode() {
console.log('checkWeChatCode');
let code = this.getUrlCode('code')
console.log(code, 'code-code-code');
// uni.showToast({
// title: `微信code=${code}`
// })
if (code) {
this.getOpenidAndUserinfo(code)
}
},
//请求微信接口,用来获取code
getWeChatCode() {
console.log('请求微信接口获取code');
let local = encodeURIComponent(window.location.href); //获取当前页面地址作为回调地址
let appid = '此处填写你的公众号appi'
//通过微信官方接口获取code之后,会重新刷新设置的回调地址【redirect_uri】
window.location.href =
"https://open.weixin.qq.com/connect/oauth2/authorize?appid=" +
appid +
"&redirect_uri=" +
local +
"&response_type=code&scope=snsapi_userinfo&state=1#wechat_redirect";
this.getOpenidAndUserinfo()
},
getOpenidAndUserinfo(code) {
let data = {
code: code,
};
data = that.$Base64.encode(JSON.stringify(data)); // Apply Base64 encoding to the data object
uni.showLoading({
title: '登录中',
mask: true
});
that.$http.post("url接口", data).then((res) => {
uni.hideLoading()
uni.showToast({
title: '登录成功',
icon: 'none'
})
});
},