dotnet / maui

.NET MAUI is the .NET Multi-platform App UI, a framework for building native device applications spanning mobile, tablet, and desktop.
https://dot.net/maui
MIT License
22.28k stars 1.76k forks source link

WebView - assets are not loaded inside html #6165

Open fairking opened 2 years ago

fairking commented 2 years ago

Description

Maui Assets are not accessible via WebView.

The following html file:

<!DOCTYPE html>
<html>
<head>
    <title>MAUI WebView Sample</title>
    <meta charset=utf-8>
    <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">

    <script src="/assets/app.js"></script>
    <script type="module" crossorigin src="/assets/vendor.js"></script>
    <link rel="stylesheet" href="/assets/app.css">
</head>
<body>
    <p>An image should be here: <img href="/images/cat-icon.png" /></p>
    <p id="cssMessage">If the css loaded properly this text is blue.</p>
    <p id="jsMessage">js resources NOT loaded.</p>
    <p id="vendorMessage">vendor resources NOT loaded.</p>
</body>
</html>

not loading assets or images.

The way how it was loaded:

using (var sr = new StreamReader(FileSystem.OpenAppPackageFileAsync("spa/index.html").GetAwaiter().GetResult()))
{
    webView.Source = new HtmlWebViewSource()
    {
        Html = sr.ReadToEnd(),
        BaseUrl = "ms-appx-web:///spa/",
    };
}

Please see the sample project: https://gitlab.com/fairking/mauiwebviewsample I am trying to make it work on Windows (I have not tested it on Android yet). I was following those docs: https://docs.microsoft.com/en-us/dotnet/maui/user-interface/controls/webview#display-a-local-html-file

image

Steps to Reproduce

https://gitlab.com/fairking/mauiwebviewsample

Version with bug

Release Candidate 1 (current)

Last version that worked well

Unknown/Other

Affected platforms

Windows

Affected platform versions

Windows SDK 10.0.19041

Did you find any workaround?

no

Relevant log output

No response

XamlTest commented 2 years ago

Verified this issue with Visual Studio Enterprise 17.3.0 Preview 1.0 [32414.199.main]. Repro on Windows. Sample Project: 6165.zip

fairking commented 2 years ago

Some additional info.

If I try to load an image with full url I got the following error message ERR_UNKNOWN_URL_SCHEME: ms-appx-web:///:

image

samhouts commented 2 years ago

Still an issue on 6.0.300-rc.4.5681.

ghost commented 2 years ago

We've moved this issue to the Backlog milestone. This means that it is not going to be worked on for the coming release. We will reassess the backlog following the current release and consider this item at that time. To learn more about our issue management process and to have better expectation regarding different types of issues you can read our Triage Process.

XamlTest commented 1 year ago

Verified this on Visual Studio Enterprise 17.6.0 Preview 4.0. Repro on Windows 11 with below Project: 6165.zip

image

bronteq commented 3 months ago

You can try MauiHybridWebView with Net8 (https://github.com/Eilon/MauiHybridWebView) or HybridWebView in Net9. In my tests with MauiHybridWebView, js files are loaded correctly by HTML code.