通用Windows應用（UWP）無法在Webview中加載本地html文件

Question

我從服務器下載了html內容，並將其存儲在Windows存儲文件夾（Windows.Storage.ApplicationData.Current.LocalFolder.Path）中。 當我使用window.location.href =“ ms-appdata：///local/inde.html”導航到該頁面時，沒有任何反應。 當我使用webView.navigate（“ ms-appdata：///local/index.html”）進行導航時，它顯示了頁面，但我的JavaScript都沒有執行。 一切都會更有幫助。

 var app = { // Application Constructor initialize: function() { this.bindEvents(); }, // Bind Event Listeners // // Bind any events that are required on startup. Common events are: // 'load', 'deviceready', 'offline', and 'online'. bindEvents: function() { document.addEventListener('deviceready', this.onDeviceReady, false); }, // deviceready Event Handler // // The scope of 'this' is the event. In order to call the 'receivedEvent' // function, we must explicitly call 'app.receivedEvent(...);' onDeviceReady: function() { app.receivedEvent('deviceready'); }, // Update DOM on a Received Event receivedEvent: function (id) { var plugin = new RuntimeComponent.Class; plugin.InitializeApp().then(function (response) { try{ (new Windows.UI.Popups.MessageDialog(response, "Title")).showAsync() }catch(e){ } }); } }; app.initialize();

 <html> <head> <meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *"> <meta name="format-detection" content="telephone=no"> <meta name="msapplication-tap-highlight" content="no"> <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width"> <link rel="stylesheet" type="text/css" href="css/index.css"> <title>Hello World</title> </head> <body> <script type="text/javascript" src="cordova.js"></script> <script type="text/javascript" src="js/index.js"></script> </body> </html>

Answer 1

當我使用window.location.href =“ ms-appdata：///local/inde.html”導航到該頁面時，沒有任何反應。

問題在於您使用的是UWP Web視圖，它是UWP中的一個封裝控件，用於承載應用程序中的HTML內容。 盡管它使用Microsoft Edge渲染引擎在為Windows 10編譯的應用程序中顯示HTML內容，但它僅以此處為例來加載內容。 與傳統瀏覽器不同，您不能使用window.location.href重定向瀏覽器的當前URL位置。

當我使用webView.navigate（“ ms-appdata：///local/index.html”）進行導航時，它顯示了頁面，但我的JavaScript都沒有執行。

當您想在WebView中調用JavaScript時，您將需要調用InvokeScriptAsync方法，我上面鏈接的官方文檔中有一些示例。 但是，如果您的js代碼應自動執行，則可能還有許多其他原因可能導致其無法執行，請共享您的html，這樣我們就可以繼續處理此情況。

最后，我建議您閱讀此博客：關於WebView的十件事。

Answer 2

window.location.href是JavaScript中使用的屬性。 但是， ms-appdata是UWP應用中使用的URI方案。 因此， window.location.href不適用於ms-appdata:///local/inde.html 。 要在WebView中加載本地html文件，我們應該使用帶有Uri的 Navigate方法，該Uri使用ms-appdata方案，就像您所做的一樣。 但在這里我們需要注意：

WebView類中的備注：

要從應用程序的LocalFolder或TemporaryFolder數據存儲區加載未壓縮和未加密的內容，請將Navigate方法與使用ms-appdata方案的Uri一起使用。 WebView對這種方案的支持要求您將內容放在本地或臨時文件夾下的子文件夾中 。 這樣可以導航到URI，例如ms-appdata：/// local / folder / file.html和ms-appdata：/// temp / folder / file.html 。

因此，就像@tao的評論所說，您應該將html和js文件放在本地文件夾下的子文件夾中，然后使用類似

webView.navigate("ms-appdata:///local/folder/index.html");

通用Windows應用（UWP）無法在Webview中加載本地html文件

問題描述

2 個解決方案

解決方案1
1 2016-11-02 06:59:04

解決方案2
0 2016-11-02 16:22:34

通用Windows應用（UWP）無法在Webview中加載本地html文件

問題描述

2 個解決方案

解決方案1 1 2016-11-02 06:59:04

解決方案2 0 2016-11-02 16:22:34

解決方案1
1 2016-11-02 06:59:04

解決方案2
0 2016-11-02 16:22:34