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

b4x-de

Active Member
Licensed User
Longtime User
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:

B4X: 
    ' 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
 

Attachments

  • B4xWebViewFragmentBug.zip
    27.4 KB · Views: 315
Sort by date Sort by votes

JohnC

Expert
Licensed User
Longtime User
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.
 
Upvote 0

JohnC

Expert
Licensed User
Longtime User
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
 
Upvote 0

drgottjr

Expert
Licensed User
Longtime User
you can do it with webviewextras.
B4X: 
    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.
 
Upvote 0

b4x-de

Active Member
Licensed User
Longtime User
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...

JohnC said:
... then you can have webview scroll to it.
Click to expand...

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
 
Upvote 0

JohnC

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

drgottjr

Expert
Licensed User
Longtime User
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.
 
Upvote 0
K

kps

Member
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
 

Attachments

  • WebViewFragmentBug-kps.zip
    215.6 KB · Views: 327
Upvote 0

b4x-de

Active Member
Licensed User
Longtime User
@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.
drgottjr said:
my solution answers your question. it does work.
Click to expand...

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:

HTML: 
<!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:

B4X: 
' 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
 

Attachments

  • B4xWebViewFragmentNoBug.zip
    9.6 KB · Views: 308
Upvote 0
You must log in or register to reply here.

Similar Threads

  • Question
Android Question ERR when loading WebView with HTML file that's in any directory except File.DirAssets
Replies
5
Views
274
Andris
  • Question
Android Question WebView does not load this url
Replies
1
Views
3K
drgottjr
H
  • Question
Android Question Problem in webview when using loadhtml and loadurl
Replies
1
Views
1K
Erel
I
  • Question
Android Question Webview does not load page
Replies
4
Views
3K
Jorge M A
F
  • Question
Android Question WebView - Html FilePicker doesn't work
Replies
2
Views
2K
FabioC6
F
Menu
Log in
Register
Cookies are required to use this site. You must accept them to continue using the site. Learn more…