uni-app之自定義404等錯誤頁面

注:本人使用微信小程序測試版、開發版等無效。但官方的參考文檔，讓我暫時記住他，以觀后效。

當Webview窗口加載錯誤地址（如本地頁面不存在）或者訪問網絡資源失敗（如無法訪問網絡）時會自動顯示默認錯誤頁面。

 可以通過以下方法，自定義webView頁面。打開manifest.json配置文件，在App常用其他設置中，打開錯誤的html頁面。

 或切換為源碼視圖，在app-plus下添加代碼。

"app-plus": {  
    "error": {  
        "url": "hybrid/html/error.html"  
    },  
    //...  
},  

 error.html需要放到根目錄下的hybrid/html目錄下，否則不會被編譯進去。

錯誤頁面中監聽事件

在定義的error.html頁面中可以通過監聽"error"事件獲取更多錯誤信息：

 // 獲取錯誤信息

document.addEventListener("error",function(e){  
    var url = e.url;  // 錯誤頁面的url地址  
    var href = e.href; // 錯誤頁面的完整路徑（包括完整的協議頭）  
},false);

 

注意
Android平台使用iframe時如果無法加載頁面在不同版本系統上存在差異：

• 5.0及以上版本：Webview窗口對象不會加載錯誤頁面，僅iframe節點顯示無法加載頁面；
• 5.0以下版本：Webview窗口對象會加載錯誤頁面。

如果需要更詳細的錯誤頁面配置，包括5+App和wap2app、單獨設置窗口的錯誤頁面、錯誤頁面的監聽事件，請參考https://ask.dcloud.net.cn/article/73。

參考網址

自定義Webview的404等錯誤頁面，Webview窗口加載頁面錯誤時顯示：https://ask.dcloud.net.cn/article/73