<!-- 非微信環境 --> <div v-show="!isWeixin" class="wap-poster-main-bg-qrcode2" id="qrcode"> <img class="wap-poster-main-bg-qrcode2-pic" :src='qrCodeImg' alt=""> </div> <!-- 微信環境 --> <div v-show="isWeixin" class="smallRoutine"> <div class="routineBtn" style="overflow:auto;text-align:center;">如長時間未顯示“打開小程序”按鈕,請刷新當前頁面</div> </div> <div v-show="isWeixin" class="smallRoutine"> <div class="routineBtn" id="routineBtn" v-html="html"> <!-- 點擊進入小程序 動態加載--> <!-- <wx-open-launch-weapp id="launch-btn" username="gh_*****" path="pages/index/index.html" > <script type="text/wxtag-template"> <button style="background:#FF4E18;border:none;color:#fff;width:100%;width:100%;height:100%;text-align:center;font-size:14px">點擊進入酒世界小程序</button> </script> </wx-open-launch-weapp> --> </div> </div>
data() { return { isWeixin:true, html:'', } }, getUserAgent(){ var ua = window.navigator.userAgent.toLowerCase(); if (ua.match(/MicroMessenger/i) == 'micromessenger') this.isWeixin=true else this.isWeixin=false },
getSdkSing(){ let _self=this; let url = window.location.href.split("#")[0] accounts.sdkSign(url).then((result) => { if(result.data.code=='200'){ let obj=result.data.data; wx.config({ // debug: true, // 開啟調試模式,調用的所有api的返回值會在客戶端alert出來,若要查看傳入的參數,可以在pc端打開,參數信息會通過log打出,僅在pc端時才會打印 appId:obj.appId, // 必填,公眾號的唯一標識 timestamp:obj.timestamp, // 必填,生成簽名的時間戳 nonceStr: obj.nonceStr, // 必填,生成簽名的隨機串 signature: obj.signature,// 必填,簽名 jsApiList: ['checkJsApi','wx-open-launch-weapp'], // 必填,需要使用的JS接口列表 openTagList: ['wx-open-launch-weapp'] // 可選,需要使用的開放標簽列表,例如['wx-open-launch-app'] }); setTimeout(()=>{ this.html = `<wx-open-launch-weapp id="launch-btn1" style="width:370px !important;display:block;height:90px !important;" username="gh_*****" path="pages/index/index.html" ><template><button id="btnOpen" style="text-align:center;color:#fff;width:100%;height:90px;background:#FF4E18">點擊進入酒世界小程序</button></template></wx-open-launch-weapp>` },2000) }else { _self.MintUI.Toast({ message:"獲取配置信息接口異常", position: 'center', duration: 1500 }); } }).catch(()=>{ _self.MintUI.Toast({ message:"獲取配置信息接口異常", position: 'center', duration: 1500 }); }); },
在wx.config下面多了一項openTagList,開放標簽列表,目前支持配置wx-open-launch-weapp,wx-open-launch-app
wx-open-launch-weapp 指H5跳轉小程序
wx-open-launch-app 指H5跳轉app
username為小程序的原始id,path對應的是小程序的鏈接地址。
目前此功能僅開放給已認證的服務號,網頁的域名要在服務號的“JS接口安全域名”下。
若公眾號頁面跳轉對應的小程序,需要注意公眾號管理后台是否添加js安全域名。