Android Question Problems with HTML5 web apps in webview

[Jack Cole]

I can't seem to get any examples of HTML5 apps to work. It seems like it is maybe not loading some things dynamically. I have tried different emulators. It works fine if I load the app from a web address.

Here is one example that I wrote many years ago. I assume there is something changed with how the webview works. I don't get errors. It just doesn't load images and the dynamically generated HTML5 doesn't seem to be working correctly. Seems like the issue probably started around late last year. Any ideas?

 

[JohnC]

Some quick thoughts (without looking at your code).

1) Make sure you are using the chromeclient with webview
2) Storage permissions have changed recently, so loading any resources might need some adjustment to work around the new restrictions.

 

[Jack Cole]

Thanks, but I am loading the chromeclient. Also, I have tried it with older Android versions, so I don't see how #2 can be an issue.

This is code that worked before. I have tried several different apps with different HTML5/JS apps, and different Android versions. There must be something different about how B4A and/or related core libraries are handling things.

 

[FrostCodes]

If that is your code, then it wont work.. Use Xui.FileUri to load the file correctly and if the app contains images, i advice you move all the files to internal storage and just load them with relative path

 

[Jack Cole]

That is my code. Xui.FileUri doesn't help.

 

[FrostCodes]

Add this before you try to load the page

    WebViewExtras1.addWebChromeClient(WebView1, "WebViewExtras1")
    WebViewSetting1.setDatabaseEnabled(WebView1, True)
    WebViewSetting1.setDOMStorageEnabled(WebView1, True)
    WebViewSetting1.setGeolocationEnabled(WebView1, True)
    
    WebViewSetting1.setJavaScriptCanOpenWindowsAutomatically(WebView1, False)
    WebViewSetting1.setSaveFormData(WebView1, False)
    WebViewSetting1.setSavePassword(WebView1, False)
    WebViewSetting1.setSupportZoom(WebView1, False)
    WebViewSetting1.setUseWideViewPort(WebView1, False)
    
    WebViewSetting1.setDatabasePath(WebView1, "")
    WebViewExtras1.addJavascriptInterface(WebView1, "B4X")

 

[Jack Cole]

Tried that, and it didn't help. Thanks for trying though.

I think I have figured out the issue. There must have been a change in the b4a build process that does not allow you to access files that are in sub folders from an HTML page. I have attached a simple example where the image in an HTML page is located in a sub folder of the assets directory. I am wondering if this is something that @Erel could fix. Simple example attached showing how it won't load an image from a sub folder.

I know you could maybe copy them to a different folder, but that is not optimal at all (especially for large html5/JS projects). Imagine taking 10 seconds at startup. Plus it is just not great technically.

 

[FrostCodes]

Tried that, and it didn't help. Thanks for trying though.

I think I have figured out the issue. There must have been a change in the b4a build process that does not allow you to access files that are in sub folders from an HTML page. I have attached a simple example where the image in an HTML page is located in a sub folder of the assets directory. I am wondering if this is something that @Erel could fix. Simple example attached showing how it won't load an image from a sub folder.

I know you could maybe copy them to a different folder, but that is not optimal at all (especially for large html5/JS projects). Imagine taking 10 seconds at startup. Plus it is just not great technically.

I checked your code its wrong... i would send a fix later as i am a little weak now

 

[Jack Cole]

Thanks. I know I can modify the HTML to reference files differently and maybe it will work, but that is not practical for a huge HTML app that references sub-folders. Again, this is all code that would have worked in the past. I think the change was when @Erel made the change to allow file groups in the IDE.

 

[FrostCodes]

You cannot use sub folders with B4a.. it doesn't work... Inside the IDE you can group files but this is not a real sub folder just a virtual group that only works in the IDE not your app to use sub folders, what i do is i compress all my files and extract them to the user internal memory and load the index file from there...

its a neat solution and i use this to run vue js with b4a

 

[Jack Cole]

What I am saying is that you could use a sub folder before changes were made to b4a. I use the zip option on b4i, because there is no other option. I would prefer not to do that as it takes a lot of time on some devices to extract 3000+ files. I will check with Erel to see if it is a bug or if it was intended for some reason.

 

[asales]

What I am saying is that you could use a sub folder before changes were made to b4a.

I had the same problem with a lib to WhatsApp stickers, that uses files in a subfolder, when the B4A 10.5+ was released. It works fine until B4A 10.2.
Erel says in this post that it happens because: "The behavior change is related to the underlying AAPT2 tool, which is used in B4A 10.7+"
Happily I has only a dozen of files in several subfolders, but 3000 files is a huge number.

 

[Jack Cole]

I had the same problem with a lib to WhatsApp stickers, that uses files in a subfolder, when the B4A 10.5+ was released. It works fine until B4A 10.2.
Erel says in this post that it happens because: "The behavior change is related to the underlying AAPT2 tool, which is used in B4A 10.7+"
Happily I has only a dozen of files in several subfolders, but 3000 files is a huge number.

Thanks for the info. Maybe it is not fixable, and I'll just have to deal with it.

 

[Erel]

The solution is here: https://www.b4x.com/android/forum/t...s-to-files-in-subdirectory.133194/post-841686

 

[FrostCodes]

Nice to see the solution...