What makes HTML5 games work?

There is no doubt that most of us have tried to open the index.html file locally, or have seen an alert that the file cannot be opened locally and must be uploaded to a platform.
Well, what’s the magic about those platforms, what do those platforms support that local browser or normal domain storage don’t.

That’s a hell of a question to unpack as there is not just a single/simple reason. I think the most basic way to explain it is when you open the index file on your computer normally with a browser (firefox, chrome, etc), you’re just seeing what can be displayed with standard HTML and none of the actual logic is being run.

When uploading it to a platform, the webserver is actually executing all the logic (javascript) as well. If you want to run your game local like you would on webserver, you can always look into xampp which lets you run a webserver locally.

1 Like

That is completely false! A webserver does not execute any JavaScript code, and opening an HTML file from your local system does not change anything about running logic it may contain.

What is happening here is quite simple: a web browser can open files from many sources: that includes http and ftp servers, but also from your filesystem, via the file:/// “protocol”. That protocol just reads data from a file on your system. However, it can only be used by you in the location bar to open a local HTML file, websites cannot request files using the file:/// protocol. Otherwise, they would be able to open any file on your computer, read your personal documents, etc… Which would be a big security flaw.

As you can see in your HTML build, there is not just a single HTML file, the code is split in a lot of smaller JS files (allowing the browser to load them in parallel for faster loading) and the resources of your project. When opening up the HTML file directly, it is loaded via the file:/// protocol, so when it tries to obtain the rest of the files next to it, it is blocked by the browser as an attempt to read local files.

When hosted on a platform or through a webserver, there is no trouble reading the files next to the html file since there is no security hazard about that.