为什么要用H5而不是用uni-app的原因,是因为ios系统H5+ launchMiniProgram的方法不能拉起小程序,只能用webview页面拉起来。
1.plus.share.getServices(获取分享服务)获取终端支持的分享通道列表,可用于提示用户进行分享列表选择。 成功后通过successCB回调返回当前环境支持的分享服务列表,失败则通过errorCB回调返回错误信息。
2.plus.oauth.getServices(获取登录授权认证服务列表)获取终端支持的权登录认证服务列表,可用于提示用户进行登录平台的选择。获取登录授权认证服务成功后通过successCB回调返回支持的所有服务列表,获取服务失败则通过errorCB回调返回失败信息。因为我需要用到微信登录授权认证,所以需要调用此接口,不用可以不调用这步。
3.onload里面还有兼容老版本的plusready事件的方法。
4.封装launchMiniProgram的方法,因为我需要用到openid,所有如果没有openid先授权,有就可以直接调用。this.sharewx.launchMiniProgram跳转到小程序。
注意:app必须在微信开发平台绑定自己的小程序,不然唤不起小程序。
2021年1月5日经过测试,launchMiniProgram这个方法,自定义基座是不能唤起小程序的,普通基座可以唤起小程序但是不能支付,需要发布生产环境的包到appstore。因为正式证书与测试证书还有打包的包名跟线上的不一致,导致以上问题。我发布成正式包放到appstore里面,经测试时可以调起小程序也可以支付。
2021年1月11日复测:HBuilder X版本号2.9.8出现了bug,ios不能拉起小程序。3.0.0以上的问题解决了此bug,普通vue页面也可以拉起小程序了。
computed: {
...mapState(['userInfo'])
}
onload() {
// #ifdef H5
if (window.plus) {
plus.share.getServices(e => {
for (let i in e) {
if ('weixin' == e[i].id) {
this.sharewx = e[i];
}
}
});
plus.oauth.getServices( e => {
for (let i in e) {
if ('weixin' == e[i].id) {
this.auths = e[i];
}
}
}, e => {
alert("获取分享服务列表失败:"+e.message+" - "+e.code);
});
let token = plus.storage.getItem('token');
if (uni.getStorageSync('token') != token) {
uni.setStorageSync('token', token);
location.reload(); //强制刷新
return;
}
} else {
// 兼容老版本的plusready事件
document.addEventListener(
'plusready',
() => {
plus.share.getServices(e => {
for (let i in e) {
if ('weixin' == e[i].id) {
this.sharewx = e[i];
}
}
});
plus.oauth.getServices( e => {
for (let i in e) {
if ('weixin' == e[i].id) {
this.auths = e[i];
}
}
}, e => {
alert("获取分享服务列表失败:"+e.message+" - "+e.code);
});
let token = plus.storage.getItem('token');
if (uni.getStorageSync('token') != token) {
uni.setStorageSync('token', token);
location.reload();
}
},
false
);
}
// #endif
mtheods: {
launchMiniProgram(orderId) {
this.openId = this.userInfo.weixinOpenid;
if (!this.openId) {
return this.auths.login(e => {
if (e.target && e.target.authResult) {
api.request(api.authByWx, e.target.authResult, 'post').then(res => {
if (res.errno == 0) { //没有openid先授权登录获取
uni.showToast({
title: '授权成功',
icon: 'none'
});
api.request(api.getUserInfo).then(res => { //这是跟后端那边把数据处理完之后把openid传过来
if (res.errno === 0) {
let userInfo = res.data.userInfo;
userInfo.levelName = res.data.userLevel.levelName;
this.$store.commit('SET_USERINFO', userInfo || {});
this.launchMiniProgram(orderId);
} else {
uni.showToast({
title: res.errmsg,
icon: 'none'
});
}
});
} else {
uni.showToast({
title: res.errmsg,
icon: 'none'
});
}
});
}
});
}
//有openid直接调用launchMiniProgram方法唤起小程序
this.sharewx
? this.sharewx.launchMiniProgram(
{
id: 'gh_xxxxxx', //注意是:小程序的原始ID
path: `pages/appHuifuPay/appHuifuPay?openId=${this.openId}&orderId=${orderId}`,
type: 0 //0是正式环境 1测试版 2是体验版本
},
res => {
console.log('res', res);
},
err => {
console.log('err', err);
}
)
: plus.nativeUI.alert('当前环境不支持此操作!');
}
}