最近要做一個(gè)項(xiàng)目需要在小程序中打開(kāi)外鏈，小程序最近開(kāi)放了web-view組件， 可在里面內(nèi)嵌自己寫(xiě)的H5頁(yè)面，也就實(shí)現(xiàn)了打開(kāi)外鏈的功能，但是有幾個(gè)注意點(diǎn)。 這里記錄一下，希望將來(lái)小程序能放開(kāi)更多限制。

申請(qǐng)業(yè)務(wù)域名

首先必須在小程序后臺(tái)配置業(yè)務(wù)域名，并且是已經(jīng)備案過(guò)的。

微信授權(quán)登錄

當(dāng)需要微信授權(quán)登錄的H5頁(yè)面直接通過(guò)小程序webview訪問(wèn)時(shí)，會(huì)報(bào)錯(cuò)。

解決方案：

對(duì)瀏覽器進(jìn)行判斷，如果是小程序webview（官方判斷條件： window.__wxjs_environment === 'miniprogram' ）就跳過(guò)授權(quán)登錄。 這樣就規(guī)避了訪問(wèn)非授權(quán)業(yè)務(wù)域名問(wèn)題。

打開(kāi)網(wǎng)頁(yè)條件

1. 小程序基礎(chǔ)庫(kù)版本要大于 1.6.4，低版本的小程序需要做兼容處理
2. 網(wǎng)頁(yè)內(nèi)容只能在 組件中顯示，它會(huì)自動(dòng)鋪滿整個(gè)小程序頁(yè)面
3. 個(gè)人類型與海外類型的小程序暫不支持使用web-view組件打開(kāi)網(wǎng)頁(yè)

示例代碼

<!– wxml –>
<!– 指向微信公眾平臺(tái)首頁(yè)的web-view –>
<web-view src=”https://mp.weixin.qq.com/”>web-view>

web-view組件接口

網(wǎng)頁(yè)中可使用JSSDK 1.3.0提供的接口返回小程序頁(yè)面，支持的接口有：

<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.0.js">script>

// javascript
wx.miniProgram.navigateTo({url: '/path/to/page'})