支付寶小程序開放組件 web-view·常見問題

H5 頁面相關

頁面訪問受限/報錯/無法跳轉(zhuǎn)的原因以及處理方法

• 不支持使用 scheme 方式進行頁面跳轉(zhuǎn)，scheme 鏈接無法配置域名。
• 不支持跳轉(zhuǎn)鏈接是支付寶錢包客戶端某個端內(nèi) H5 頁面，請不要使用該方式。
• 域名僅支持 https 開頭的鏈接，格式支持英文大小寫字母、數(shù)字、及“-”，不支持 IP 地址及端口號。
• 需下載校驗文件，并放置于配置域名的根目錄下。
• 不支持 H5 頁面為重定向頁。
• 配置域名后，請重新設置體驗版或者推送真機預覽。
• 線上版本配置 H5 域名后需要重新發(fā)布新版本上架。
• 沒有配置 H5 域名白名單，請參照 配置 H5 域名 完成配置，如遇白名單添加后仍然顯示頁面受限問題，請參見 web-view 調(diào)試報錯頁面訪問受限處理方法。
• 支付寶 App 版本過低導致，升級至最新版本即可。

如何處理 web-view 加載 H5 偶現(xiàn)白屏現(xiàn)象？

應該是 H5 網(wǎng)頁樣式的不適配，建議檢查一下重新設置樣式。

為何在 web-view 嵌入的 H5 中使用拼接 URL 方式進行用戶授權報錯訪問受限？

不建議使用 web-view 嵌套 H5 進行 url 拼接授權，在 web-view 中使用 postmessage 發(fā)消息到小程序，小程序接收消息調(diào)用用戶授權 API。

web-view 內(nèi)嵌的 H5 是否支持上傳圖片？

不支持。

小程序 web-view 如何打開小程序包內(nèi)本地 html 文件 ？

web-view 只能打開 https 域名的 H5 鏈接。

小程序 web-view 開發(fā)階段如何調(diào)試 H5 頁面？

上線 H5 代碼，IDE 模擬器中點擊 web-view 進行調(diào)試。

web-view 如何在本地開發(fā)調(diào)試傳過來的數(shù)據(jù)？小程序支持外跳 H5 頁面拉起支付嗎？

可以使用本地搭建的環(huán)境測試。

不支持外跳，可以使用 web-view 嵌套 H5 頁面，在 H5 頁面中使用小程序支付的 API 來實現(xiàn)調(diào)起支付功能。

支付寶 H5 中設置的 cookie 與小程序 web-view 中的 cookie 是否共享？

H5 和 web-view 的 cookie 是不同的，小程序針對服務端回設的 cookie 不會禁用掉，會設置到小程序進程中，下次小程序進行請求，會自動將已有的 cookie 帶入到服務端請求中。前端獲取不到 cookie，也不會對 cookie 做任何操作。小程序不建議使用 cookie，推薦使用小程序緩存。

web-view 嵌套的 H5 如何獲取小程序緩存？web-view 如何清除緩存？web-view 如何讀取小程序的 localstorage？

通過 web-view 內(nèi) H5 交互獲取小程序緩存.

可使用 my.clearStorage 或者點擊 IDE 右上角的 清緩存 清除緩存數(shù)據(jù)。如果是 web-view 總頁面的緩存可以關閉小程序，重新打開支付寶。

web-view 的緩存和小程序緩存是隔離的，不能直接讀取。都可以使用 API my.clearStorage 清除緩存。

H5 封裝的小程序用 localstorage 設置的緩存，為何推出小程序取得的緩存是很早之前的數(shù)據(jù)？

web-view 頁面存在緩存，建議動態(tài)鏈接訪問最新地址。

為何商戶小程序 web-view 打開 H5 頁面請求抓不到包？

web-view 不支持抓包?？勺孕性?H5 頁面中調(diào)試，保證 H5 顯示沒有問題后再放入 web-view 中打開。

web-view 為首頁的時候，H5 頁面跳轉(zhuǎn)沒有返回按鈕？

可使用 window.location 去跳轉(zhuǎn)頁面。

小程序中沒有原生的小程序代碼，是否可以通過 web-view 全部實現(xiàn)？

如果 H5 項目中沒有調(diào)用 jsapi 而且也沒有集團域名是可以實現(xiàn)的，但是不建議如此操作，建議開發(fā)原生小程序，小程序嵌套 H5 和獨立 H5 體驗都不如原生小程序。

web-view 小程序和支付寶相互通信，是否支持互相一直發(fā)消息?

觸發(fā)一次 H5 往小程序發(fā)，然后小程序往 H5 發(fā)一次。

web-view 放在 tabbar 里面切換 tab 如何重新加載頁面？

建議使用 H5 刷新頁面的方式。

H5 頁面如何判斷當前打開環(huán)境的方法？

判斷是小程序的 web-view，還是支付寶內(nèi)置瀏覽器可以使用 my.getEnv 接口，調(diào)用 my.getEnv 前需要在 H5 頁面中引入 https://appx/web-view.min.js 依賴。

//判斷是否運行在小程序環(huán)境里


my.getEnv(function(res){


console.log(res.miniprogram); //true


});

通過 web-view 插入一個 H5 頁面，為何使用 hidden 來實現(xiàn)顯示/隱藏這個包裹 web-view 的元素不生效？

使用 a:if 可以實現(xiàn)顯示/隱藏。

web-view 頁面設計相關

• web-view 界面不支持顯示 tips。
• web-view 的標題取決于 H5 的標題，如需修改，請直接修改 H5 的標題內(nèi)容。但是標題無法隱藏。
• 一個 web-view 里面不能有太多嵌套，過多嵌套會影響性能，所以一般建議試圖容器嵌套不超過 5 個。
• 嵌套了 web-view 的頁面加載過程中都會顯示一個加載進度條，無法去掉。
• web-view 中的 H5 的返回按鈕不支持控制顯示隱藏。

小程序分享成功后如何告知 web-view 組件分享成功的狀態(tài)？

小程序中監(jiān)聽 onShareAppMessage 的 success 回調(diào)，然后傳給 web-view。

為何在 web-view 頁面添加按鈕不顯示？

web-view 的 H5 頁面上不承載其他組件，即便添加也不會顯示。

web-view 頁面嵌套小程序，為何獲取手機號授權返回無效的授權方式？

web-view 無法使用小程序的 button 組件，所以會異常。

開放能力

為何 web-view 使用圖片上傳跳回 web-view 首頁？

在最近使用中刪除該小程序，重新掃碼調(diào)試。

小程序中是否可以引入第三方 URL 頁面？

不可以。web-view 只能承載自己的 H5 頁面。

如何實現(xiàn)在 web-view 中跳轉(zhuǎn)到其他小程序？

使用 web-view 與小程序通信交互，然后再小程序頁面 js 中調(diào)用 my.navigateToMiniProgram 跳轉(zhuǎn)到其他小程序。

web-view 中引入的 js 有本地文件嗎？ js 只支持在線訪問嗎？ js 只能使用鏈接引入不能手動引入嗎？

本地沒有 js 文件，僅支持在支付寶客戶端（小程序）內(nèi)使用鏈接 H5 引入 ，不支持下載也不建議引用本地文件。

web-view 支持刷新當前頁面嗎？

web-view 中沒有該接口，可以重新請求數(shù)據(jù)從而更新頁面。

小程序中可以調(diào)用支付寶開放平臺的授權嗎？

建議通過小程序與 web-view 交互的方式，由小程序獲取手機號通過交互傳給頁面。

程序在控件顯示上，能否在原生控件（地圖控件）上疊加顯示 web-view 控件？

不支持這樣的操作。

web-view 是否可以預覽本地文件？

IDE 可預覽本地文件，真機不支持。

為何 web-view 嵌套的 Html 內(nèi)容已變更，但 IDE 中沒有顯示變更后的內(nèi)容？

在嵌套的 Html 鏈接后面加上參數(shù)，使其不讀取緩存，實現(xiàn)獲取 Html 的最新內(nèi)容。

iOS 設備小程序 web-view 內(nèi)播放視頻退出小程序后視頻仍然播放如何解決？

在頁面隱藏時，通過 web-view 和 H5 雙向通信，進行視頻暫停。