1登錄微信公眾平臺進(jìn)入“公眾號設(shè)置”的“功能設(shè)置”里填寫“JS接口安全域名”。
2這個JS接口安全域名就是訪問你H5地址的域名。
3通過config接口注入權(quán)限驗(yàn)證配置并申請所需開放標(biāo)簽(簽名算法)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>測試跳轉(zhuǎn)小程序</title>
</head>
<body>
<h1>下面是按鈕</h1>
<wx-open-launch-weapp
id="launch-btn"
username="gh_64f20a68865d"
path="__plugin__/wx2b03c6e691cd7370/pages/live-player-plugin.html?room_id=129"
>
<template>
<style>.btn { padding: 12px }</style>
<button class="btn">打開小程序</button>
</template>
</wx-open-launch-weapp>
</body>
{include file="common/wap_js" /}
{notempty name="$signpackage"}
<script src="http://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
<script>
$(function(){
wx.config({
debug: false, // 開啟調(diào)試模式,調(diào)用的所有api的返回值會在客戶端alert出來,若要查看傳入的參數(shù),可以在pc端打開,參數(shù)信息會通過log打出,僅在pc端時才會打印。
appId: '{$signpackage.appId}', // 必填,公眾號的唯一標(biāo)識
timestamp: '{$signpackage.timestamp}', // 必填,生成簽名的時間戳
nonceStr: '{$signpackage.nonceStr}', // 必填,生成簽名的隨機(jī)串
signature: '{$signpackage.signature}',// 必填,簽名
jsApiList: ['updateAppMessageShareData','updateTimelineShareData','onMenuShareAppMessage','onMenuShareTimeline'] ,// 必填,需要使用的JS接口列表
openTagList: ['wx-open-launch-weapp'] // 可選,需要使用的開放標(biāo)簽列表,例如['wx-open-launch-app']
});
var btn = document.getElementById('launch-btn');
btn.addEventListener('launch', function (e) {
console.log('success');
});
btn.addEventListener('error', function (e) {
console.log('fail', e.detail);
});
});
</script>
{/notempty}
</html>
如果上面操作都沒有問題 那么打開頁面會顯示這樣的界面

這里可以看到config配置都加載出來了,但是按鈕沒有顯示
直接用手機(jī)打開這個網(wǎng)頁


好的,測試成功。
有的<template>這個標(biāo)簽不顯示換成<script type="text/wxtag-template">這個試試
如果按鈕手機(jī)上不顯示 檢查下config是否載入 檢查APPID是否是對應(yīng)的服務(wù)號,檢查JS安全域名是否配置了你的H5域名地址。

如果出現(xiàn)圖上這樣的問題:需要確認(rèn)一下,微信版本要求為:7.0.12及以上。 系統(tǒng)版本要求為:iOS 10.3及以上、Android 5.0及以上。
<wx-open-launch-weapp
id="launch-btn"
username="gh_64f20a68865d"
path="__plugin__/wx2b03c6e691cd7370/pages/live-player-plugin.html?room_id=129"
>
此標(biāo)簽id為小程序的原始ID,path為小程序的頁面地址后面必須加.html,上面這個地址是我跳轉(zhuǎn)小程序直播間,親測成功。
你可以跳轉(zhuǎn)任意小程序,只需要知到他頁面地址。頁面地址的獲取方法:

我這里以QQ音樂小程序?yàn)槔?/p>
1.第一步把該小程序添加到我的小程序
2.第二部點(diǎn)擊名稱 查看更多資料獲取到原始ID和APPID
3.進(jìn)入小程序后臺,點(diǎn)擊工具獲取小程序碼,把剛剛得到的APPID放進(jìn)去


4.點(diǎn)擊獲取更多頁面路徑,把自己的微信號填進(jìn)去,點(diǎn)擊開啟。然后回到QQ音樂小程序,點(diǎn)擊右上角三個點(diǎn),你會發(fā)現(xiàn)多了個復(fù)制鏈接。

pages/home/home.html 這個就是獲取到QQ音樂的頁面鏈接。
然后我們把原始ID和這個鏈接填入到剛剛H5標(biāo)簽內(nèi),就可以跳轉(zhuǎn)到QQ音樂了。