需求體現：

在小程式裡面，點選檢視使用者簽訂的協議，跳轉到協議詳情頁，剛好協議詳情頁在另一個H5專案的已經有，所以就想直接跳轉過去，不必再重複開發小程式版本的模組

實現H5頁面跳轉

小程式裡面載入H5頁面，需要嵌在web-view裡面，注意：一個專案只能有一個。 例如：在小程式裡面開啟百度網頁 在小程式專案裡面src/pages/新建一個webview的資料夾，含有wxml/wxss/json/js

wxml：

<web-view src="{{ src }}"></web-view>

js：在onLoad裡面獲取到url這個引數，然後賦值給data，這樣在wxml裡面就能取到src的值。

Page({

data: {

url: '',

},

onLoad: function (param) {

this.setData({

url: decodeURIComponent(param.url),

})

}

});

json/wxss可以是空檔案

在小程式的頁面跳轉到H5頁面的寫法

wx.navigateTo({

url: '../webview/index?url=/file/2019/10/22/20191022194650_94456.jpg.html url: `/page/account/index`,

});

小程式和H5互跳注意事項

1． 【問題描述】wx.miniProgram.navigateTo中url無法跳轉問題

【問題解決】:app.json中配置的tabBar與wx.navigateTo中的url引用相同頁面導致

首先pages/account/index這個路徑在app.json已經存在，也就是當前從H5頁面window.wx.miniProgram.navigateTo(url)的url已經和app.json的一樣。此時是不能通過這個方式跳轉，而是要改成window.wx.miniProgram.reLaunch(url)

總結：如果url在app.json已定義，則使用reLaunch跳轉，如果沒有，則使用miniProgram.navigateTo(url)

2. 【問題描述】在小程式裡面跳轉到H5協議詳情頁的時候，進入了系統錯誤頁（專案裡定義好的錯誤頁），當我現在微信公眾號開啟該協議詳情頁，此時再從小程式進入，不會出現。

定位問題過程：H5頁面是vue頁面，先從路由檔案/routes/index.js開始debugger，果然就在登入的js裡面找到問題，檢視登入的js裡面有一個先會登出的過程，然後再login（這裡是因為不同券商的原因，需要logout清除上一個券商的資料，哈哈，流水賬，不然越記越長，不展開咯）在登入logout的過程，此時該cgi丟擲異常，剛好被全域性捕獲，所以進入了系統錯誤頁。 後面的解決方法，是在登出的時候try catch捕獲異常，不要把異常被全域性捕獲。

try {await request('logout.cgi')} catch(e) {console.log('error')}