Referencing local files from HTML in Android

Question

I have a very simple HTML app with uses a couple of js files, a css and several images. I have all of them bundled on a folder that I downloaded to my mobile phone in the Downloads folder.

Now, when I go to the folder and open the main html file, it opens in Chrome browser in the following url: content://media/external/file/<10 digit number> and no other file, locally referenced from it, loads. This means there are no images, and of course, no js functionality.

Where should I place my files, or how should I reference them from the main html file, to achieve a normal course of operation, where those files are normally loaded when executing main HTML file?

I know that I could download a small web server to run it locally and make it serve the page, but that seems quite overkill to me and I'd like to left that as a very last resort option.

Answer 1

You can use http protocol to access it. Apps like http server and cx file explorer.

Answer 2

For the sake of those who might be on a similar situation, there is a MUCH BETTER approach to run your html + js + css apps on mobile devices.

You just need to convert them to Proggressive Web Applications (PWA), this means just to tweak them lightly and add a manifest file. Those apps CAN be INSTALLED on mobile devices directly from browsers, working as native apps.

You can find info about this topic in https://web.dev/explore/progressive-web-apps?hl=es-419

Answer 3

You placed your files in a suitable folder.

The problem is that you used a content scheme uri that also hides real file names.

content://media/external/file/123456

points to your html file. If the browser has to display a picture like image.jpg it will build an uri like content://media/external/file/image.jpg.

But that is no valid uri as this provider uses digits like you told us. And even if the url was ok you would not have read permission for it.