1、html頁面引入https://res.wx.qq.com/open/js/jweixin-1.6.0.js

<script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>

2、html頁面 新增標籤wx-open-launch-weapp，並設定username（小程式的原始id，公眾平臺可以拿到gh_xxxxxx）,path（跳轉的小程式頁面，路徑要加.html，帶參的話在wx-open-launch-weapp標籤上setAttribute.(）），注意 設定wx-open-launch-weapp的樣式,按鈕的樣式必須寫在template內部。

<wx-open-launch-weapp id="launch-btn" username="gh_fdcf82b6fa07" path="pages/index/index.html?id=111">
        <template>
            <style>
                .btn{
                    color: #fff;
                    font-size: 18px;
                    text-align: center;
                    width: 206px;
                    height: 44px;
                    line-height: 44px;
                    margin: 53px auto;
                    background-color: #572b8c;
                    border-radius: 30px;
                    letter-spacing: 2px;
                }
            </style>
            <div class="btn">跳轉小程式</div>
        </template>
    </wx-open-launch-weapp>

　　3、調介面拿到小程式簽名配置資訊，拿到配置資訊後，向配置資訊內新增openTagList:['wx-open-launch-weapp']

    $.ajax({
        type: 'GET',
        url: '介面路徑',
        dataType: 'json',
        success: function(res){
            res.openTagList = ['wx-open-launch-weapp']
            res.debug = true
            wx.config(res)
            wx.ready(function () {
                cb && cb()
            })  
        },
        error: function(xhr, type){
          console.log(`${type}: ${xhr}`)
        }
      })

4、到目前為止，在瀏覽器，或者開發工具上都沒辦法看到你加按鈕，所以最好提前寫好樣式。配置安全域名：1、把h5放到伺服器，拿到域名後登入微信公眾平臺進入“公眾號設定”的“功能設定”裡填寫“JS介面安全域名”。2、把h5上傳到騰訊雲上。

5、用手機檢視線上h5，這個時候終於看到按鈕了，然後點選看是否成功，如果提示小程式未釋出，先將需要跳轉的小程式釋出到線上