1.引入最新版的,微信jdk js包
<script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js" type="text/javascript"></script>
2.配置html
<span class="open"><span>打开APP</span>
<wx-open-launch-app style="position:absolute;top:0;left:0;right:0;bottom:0;opacity: 0;" id="launch-btn"
appid="*****" extinfo="your-extinfo">
<template>
<style>
.btn {
width: 100%;
padding: 12px;
height: 150px;
}
</style>
<button class="btn">App内查看</button>
</template>
</wx-open-launch-app>
<script>
var btn = document.getElementById('launch-btn');
btn.addEventListener('launch', function (e) {
console.log('success');
console.log(e.detail.errMsg);
if(e.detail.errMsg.indexOf("fail")!=-1){
openstore();
}
});
btn.addEventListener('error', function (e) {
console.log(e.detail.errMsg);
if(e.detail.errMsg.indexOf("fail")!=-1){
openstore();
}
});
</script>
</span>
3.配置微信的权限注入
var imgUrl = 'https://www.foresee-future.com/manager/loge.ico';
var lineLink = window.location.href.split('#')[0];
var lineLinkshare = window.location.href.split('#')[0];
var descContent = '找粮App';
var shareTitle = '打开找粮App';
var shareTitlephone = '打开找粮App';
$.ajax({
type: 'POST',
contentType: "application/json;charset=UTF-8",
url: "https://*****/getSignature",
dataType: 'json',
data: JSON.stringify({
'url': lineLink
}),
success: function (result) {
if (result.success) {
configdata = result.data;
wx.config({
appId: configdata.appId,
timestamp: configdata.timestamp,
nonceStr: configdata.nonceStr,
signature: configdata.signature,
jsApiList: ['updateAppMessageShareData',
'onMenuShareTimeline',
'updateAppMessageShareData',
'wx-open-launch-app',
'updateTimelineShareData',
'onMenuShareQQ',
'onMenuShareWeibo',
'onMenuShareAppMessage',],
openTagList: ['wx-open-launch-app']
});
wx.ready(function () {
wx.checkJsApi({
jsApiList: ['wx-open-launch-app'],
success: function (res) {
console.log(res)
console.log('可用')
},
fail: (err) => {
console.log('不可用')
}
})
wx.updateAppMessageShareData({
title: shareTitlephone,
desc: descContent,
link: lineLink,
imgUrl: imgUrl,
success: function () {
},
cancel: function () {
}
})
wx.updateTimelineShareData({
title: shareTitle,
link: lineLink,
imgUrl: imgUrl,
success: function () {
},
cancel: function () {
}
});
wx.onMenuShareAppMessage({
title: shareTitlephone,
desc: descContent,
link: lineLink,
imgUrl: imgUrl,
type: '',
dataUrl: '',
success: function () {
},
cancel: function () {
}
});
wx.onMenuShareTimeline({
title: shareTitle,
desc: descContent,
link: lineLink,
imgUrl: imgUrl,
type: '',
dataUrl: '',
success: function () {
},
cancel: function () {
}
});
wx.onMenuShareQQ({});
wx.onMenuShareWeibo({});
wx.onMenuShareQZone({})
});
}
}
})
4.关于微信浏览器打开App,需要进行的步骤
申请与微信开发平台相同主体的微信公众平台账户,申请为服务号账户,还有开通微信认证

该服务号,需要配置js安全域名 IP白名单


同时,微信开发平台需要绑定该服务号,微信开发平台也需要绑定APP



引入前端SDK,后端提供接口注入权限,app也需要做相关的配合