實現小程序和H5頁面之間互相跳轉

需求

H5頁面，點擊按鈕進入到指定路徑的小程序中。

H5跳轉到小程序

從H5頁面返回小程序頁面，須要使用微信SDK提供的跳轉方法。 使用微信的SDK方法，須要先發送簽名驗證wx.config。

web-view網頁中可以使用JSSDK1.3.2提供的接口返回小程序頁面

1. H5：wx.miniProgram. 跳轉

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

<script>
    $(function () {
        //要運用web-view
        let productId = 'IIeC';
        let webViewUrl = 'http://wx.gemii.cc/gemii/wenjuan/'
       
        //向小程序發送消息
        wx.miniProgram.postMessage({ data: 'foo' });
    
         // 跳轉到小程序的一個頁面
         wx.miniProgram.navigateTo({ 
            url: `/pages/buyer/bargain/bargain?scene=${productId}&webViewUrl=${webViewUrl}` })
            
        wx.miniProgram.redirectTo({
            url: `/pages/sell/poster/index?dataUrl=${res2.resultContent}&scene=${parmas.id}&updateState=${parmas.updateState}`
        })

    })

</script>
複製代碼

2. 小程序：經過options獲取相關數據

onLoad: function (options) {
    this.setData({
        updateState: options.updateState || null,
        imgUrl: options.dataUrl,
        scene: options.scene
    });
    SELL.getGoodDetail(options.scene, res => {
        "use strict";
        //console.log(res)
        if (res.data.resultCode === '100') {
            this.setData({
                dataParams: res.data.resultContent
            })
        }
    })
},
複製代碼

小程序跳轉到H5

webview.js
onLoad:function:(options){
    this.setData({
        url:options.url
    })
}

webview.wxml
<web-view src="{{ url }}"></web-view>
複製代碼

index.js
handleGoH5:function(){
    wx.navigateTo({
      url: '/pages/webview/index?url=http://grouppet.chaojibaoma.com/common/tmall/index.html?ticketcode=gnc1122_1&clickcode=GNC-914njOkO',
    })
}

index.wxml
<button bindtap="handleGoH5" >跳轉H5</button>
複製代碼