Android Question [SOLVED] Local file with URI fragments in a WebView

[b4x-de]

Hi,

showing a remote URL with a URI fragment in a WebView works fine. For example the URL https://www.b4x.com/android/help/views.html#webview_loadurl is shown in a Webview.

Using a local saved html file with framents does not work. Is there any way to show something like "views.html#webview_loadurl"?

This is the way I tried:

    ' Works
    WebView1.LoadUrl("https://www.b4x.com/android/help/views.html#webview_loadurl")
    
    ' Using same page but localy saved
    ' Does not work
    WebView1.LoadUrl(xui.FileUri(File.DirAssets, "views.html#webview_loadurl")) ' File is not found
    
    ' Does not work
    WebView1.LoadUrl(xui.FileUri(File.DirAssets, "views.html") & "#webview_loadurl") ' URI Fragment is ignored
    
    ' Does not work
    Dim strDir As String
    strDir = rp.GetSafeDirDefaultExternal("html")
    File.Copy(File.DirAssets, "views.html", strDir, "views.html")
    WebView1.LoadUrl("file://" & File.Combine(strDir, "views.html#webview_loadurl")) ' URI Fragment is ignored
    
    ' Any ideas?

My example project is attached to this post.

Does anyone has an idea how to use a local file with URI fragments in a WebView?

Thanks,
Thomas

 

[JohnC]

The part of the URL that starts with a pound sign "#" is not a URI fragment, it's a bookmark/pointer to a particular point in the page so that a browser can auto-scroll/jump to that particular point in the webpage:

W3Schools.com

W3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more.

www.w3schools.com

The above link shows you how to insert bookmarks into an HTML page and then you can have webview scroll to it.

 

[JohnC]

But, if you real question is how to display asset files in a local html page loaded into a webview, then this might help:

file:///AssetsDir/1a.html

where do i put the 1a.hml file in orede to dysplay it in the AssetsDir? my code is the following Sub Globals 'These global variables will be redeclared each time the activity is created. 'These variables can only be accessed from this module. Dim webview1 As WebView End Sub Sub...

www.b4x.com

 

[drgottjr]

you can do it with webviewextras.

    wex.executeJavascript(webview, "window.location.hash='#webview_loadurl';")

the only trick is timing. i had to insert a sleep after loading. 5 seconds was enough. you could whittle it down to where it doesn't work.

 

[b4x-de]

Thanks for giving me the chance to describe my problem more clearly. I'm not asking for URI fragments (also known as bookmarks). I'm familiar with it.

I'm asking for a way to let the Webview scroll to it. The problem is: when I try to load it from a local file it does not. Even when you and me would expect...

... then you can have webview scroll to it.

To put my question more clearly: How can I make the Webview scroll to a fragment in a local file?

I don't get it work. Thanks to @drgottjr for his proposal. Is there any way to make it with a regular Webview without Webviewextras executing JavaScript to manipulate the location? If not, is it a bug in Webview? Could someone try the attached project to verify that?

Thanks,
Thomas

 

[JohnC]

Did you try adding the chromeclient to the webview (as described in item #1 in my post signature below) to see if it helps?

 

[drgottjr]

my solution answers your question. it does work. what did you do to make it not work? i tested it before i posted the solution.

webviewextras is a regular part of a regular webview. if you look at android's documentation, you would see that.

 

[kps]

It appears it may not be a bug with Webview. Something could be wrong with your local file.

I took your attached project.
I opened your weblink in browser.
I saved it as a local file.
I put it in the files tab.
I changed the filename to my newly saved file.
It works.

I have attached the zip.
You can try it.

Cheers,
KPS

 

[b4x-de]

@JohnC Thank you for providing this helpful information in your signature. On my mobile device the browser does not show the users signature. It was helpful to point me to it in your second post.

@drgottjr Your solution is a very clever hack to make it work. Thank you for sharing it.

my solution answers your question. it does work.

In addition to the solution provided I was just wondering why the Webview seems to behave different when loading a page with a fragment identifier from a remote server via http:// or https:// protocol from loading it from local file system using file:// protocol.

Thanks to @kps I realized it was my fault. I thought it would be a good idea to load a demo page from b4x.com to show the different behavior. But it turns out that the saved page was broken (it was actually no html but a text file).

When using a simple local html file with both versions of fragment identifiers (the old anchor technique in line 9 and new id technique in line 12) everything works fine. For this simple html local file the Webview behaves like expected. It scrolls to it!

Here is the html file used:

<!doctype html>
<html>
<head>
<title>Simple page</title>
</head>
<body>
<h1>Simple page</h1>
<p>Lorem ipsum …</p>
<a name="scroll1"></a>
<h2>Scroll here by anchor</h2>
<p>Lorem ipsum dolor …</p>
<h2 id="scroll2">Or scroll here by id</h2>
<p>Lorem ipsum dolor sit …</p>
<h2>Do not scroll here</h2>
<p>Lorem ipsum ...</p>
</body>
</html>

This is the code that works:

' Using localy saved file
' Does not work
WebView1.LoadUrl(xui.FileUri(File.DirAssets, "simple.html#scroll1")) ' File is not found

' Does work
WebView1.LoadUrl(xui.FileUri(File.DirAssets, "simple.html") & "#scroll1") ' Scrolls to URL Fragment using an anchor

' Does work
Dim strDir As String
strDir = rp.GetSafeDirDefaultExternal("html")
File.Copy(File.DirAssets, "simple.html", strDir, "simple.html")
WebView1.LoadUrl("file://" & File.Combine(strDir, "simple.html#scroll2")) ' Scrolls to URL Fragment using an id

Updated b4a project is attached to this post.

The conclusion is, that we found no bug in WebView but we might have a Bug in xui.getFileUri() since it does not handle a fragment identifier although the name of this operation refers to URI standard (see RFC 2396 section 4.1). But reading the b4x documentation of getFileUri() operation it expects a FileName and therefore XUI considers a fragment to be part of the filename instead. We probably need to be aware of it.

Thanks to everyone for helping with this problem!

Thomas