Xamarin.Forms ERR_FILE_NOT_FOUND (file:///android_asset/Content/https://stackoverflow.com) using HybridWebViewSample

Question

I followed the post to create a custon WebView to interact with client JavaScript: https://docs.microsoft.com/es-es/xamarin/xamarin-forms/app-fundamentals/custom-renderer/hybridwebview

But when I try to load a page, for example https://www.google.es, the wevView shows an "ERROR_FILE_NOT_FOUND" loading the page "file:///android_asset/Content/https://www.google.es"

This the OnElementChanged of the HybridWebViewRenderer:

protected override void OnElementChanged(ElementChangedEventArgs<Xamarin.Forms.WebView> e)
{           
    base.OnElementChanged(e);

    if (e.OldElement != null)
    {
        Control.RemoveJavascriptInterface("jsBridge");
        ((HybridWebView)Element).Cleanup();
    }
    if (e.NewElement != null)
    {
        Control.SetWebViewClient(new JavascriptWebViewClient($"javascript: {JavascriptFunction}"));
        Control.AddJavascriptInterface(new JSBridge(this), "jsBridge");
        Control.LoadUrl($"file:///android_asset/Content/{((HybridWebView)Element).Uri}");
    }
}

Edited: It seems hybridWebView doesn't work with external pages!

Any suggestion?

The LoadUrl method loads the HTML file that's specified by the HybridWebView.Uri property (index.html). The code specifies that the file is stored in the Asset>Content folder of the project. You could download the source file from the MS docs for reference. What do you want to do when you load https://www.google.es? Perform the website in webview? — Wendy Zang - MSFT
Yes, I want to load an external website (mine) and interact with javascript with this site. For example: I have an HTML chat published in a web, and I want to access to the geolocation and camera (for example) from Xamarin to send my geolocation, camera screenshots, verify the ientity, etc... to the chat. P.D.: Acess to the DOM is always valid for me. — Duefectu
Does external website is a html file made by yourself? If yes, put it into Assets folder. It would call invokeCSharpAction to interact with javascript with this site. You could check the link to create web page. docs.microsoft.com/en-us/xamarin/xamarin-forms/app-fundamentals/… — Wendy Zang - MSFT
The external website is mine, but is part of an ASP dotnetcore project. I can't put into Assets folder. :( — Duefectu
Thanks for sharing. You could share in answer and accept it. — Wendy Zang - MSFT

Duefectu Duefectu · Accepted Answer · 2020-03-25T15:47:56

Solved:

Changing the LoadUrl method:

Control.LoadUrl($"file:///android_asset/Content/{((HybridWebView)Element).Uri}");

by:

UrlWebViewSource source = Element.Source as UrlWebViewSource;
Control.LoadUrl(source.Url);

Works with external webs and can retrive JavaScript callBacks and send JavaScript code. This is the full code:

protected override void OnElementChanged(ElementChangedEventArgs<Xamarin.Forms.WebView> e)
{           
    base.OnElementChanged(e);

    if (e.OldElement != null)
    {
        Control.RemoveJavascriptInterface("jsBridge");
        ((HybridWebView)Element).Cleanup();
    }
    if (e.NewElement != null)
    {
        Control.SetWebViewClient(new JavascriptWebViewClient($"javascript: {JavascriptFunction}"));
        Control.AddJavascriptInterface(new JSBridge(this), "jsBridge");
        UrlWebViewSource source = Element.Source as UrlWebViewSource;
        Control.LoadUrl(source.Url);
    }
}

Xamarin.Forms ERR_FILE_NOT_FOUND (file:///android_asset/Content/https://stackoverflow.com) using HybridWebViewSample

1 Answers