Fork of UE 4.27.2 with HTML5 platform using ES3 shaders

[SpeculativeCoder]

Hi all,

I have created a fork of UE 4.27.2 (last version of UE4) with work on the HTML5 platform plugin to make it use ES3 shaders and a recent version of emscripten (plus some other changes):

https://github.com/SpeculativeCoder/UnrealEngine-HTML5-ES3

I've put a bunch of info on that page if interested.

I have tested it on Windows with Firefox and Chrome-based browsers. Hopefully will be of use if wanting to use WebGL with the most recent version of UE4.

[Sekretz]

So will it work for UE 5.1 which is also based on same openGL ES version right ?

[Sekretz]

I tried with your Platform folder with 5.1 git source. It seems need to patch these. Other than that it will will work well.

[SpeculativeCoder]

Hi @UE5Web - the engine patch won't apply as it is designed specifically for the UE 4.27.2 source (so all the changed lines have to match up etc.). There are likely a lot of changes in between UE 4.27.2 and the latest UE 5.1 (recently released) but I have not yet looked at it so not sure what is possible or how much effort this would involve. In addition to any engine patch - the code in the HTML5 plugin itself would likely also need modifying to cope with underlying changes in the engine.

I am currently using the 4.27 HTML5 for a project I'm working on so maintaining that in a working state is my focus at the moment (likely with improvements / fixes for emscripten changes) but who knows in the future...

[SpeculativeCoder]

Updated to emscripten 3.1.26

Also added some experimental support for WebSocket SSL to allow HTML5 multiplayer to still function when Unreal is served via HTTPS (browser requires a secure websocket i.e. wss:// when the original web page was served by HTTPS).

[ikarasdream]

Morning, Speculative,

very fan of your work, any help in bringing Unreal projects to web is more than welcome (I will never understand why Epic discarded such a good tool).

We already tried the 4.24 fork by Nickshin, but after installing it and testing our project, we saw that the interface buttons didn't work (I don't know if we did something wrong on our side, but in the native 4.23 export they do work). And now we are interested in testing your project and installing your 4.27 version, which is even juicier with the new features that this version of Unreal includes.

But first of all I would like to ask, do the interface elements work correctly when exported to web? Specifically the buttons.

Any help is welcomed :D

Greetings!

[SpeculativeCoder]

Hi @ikarasdream

Which buttons did you notice were not working. Do you mean the blue buttons below the Unreal client (like Pause / Resume etc.?) or do you mean some buttons in your actual Unreal game / project?

If you mean the blue buttons at the bottom the 4.27 fork still has them. The Play/Pause should work as expected. The Clear IndexedDB should still clear out the local cached data (next reload of web page will then download the Unreal data again). The "Toggle Log" button was removed as that functionality wasn't working (you can still see log messages in the browser console though e.g. F12). Fullscreen should also work.
However note that all buttons except "Clear IndexedDB" won't do anything until Unreal has started and is running successfully.

If you are referring to interface buttons in your actual game / project then in the 4.27 fork you should be able to click on them as the mouse / clicking works and Unreal receives the mouse clicks OK (at least for the UI elements I have done in my project).

[ikarasdream]

Hello Speculative,

thanks for your reply. Actually none of the buttons worked, neither the browser's own, nor the ones I made inside Unreal. I created some buttons in a Widget Blueprint in 4.24 and, when I packed the project into the web, they didn't work. They didn't even looked like the buttons I made inside the editor.

Yep, 4.23 was the last one to have the functionality inside Unreal itself and the buttons I made in that version did work when I brought them into the web.

Right now I'm installing version 4.27 thanks to your fork. I will update this post once I check if the buttons work for me or not.

[JCBuck]

Thank you for the very detailed steps to clone, and build it for 4.27.2

[JCBuck]

For those receiving an error after trying to run Setup.bat or Setup.sh

D:\dev\ue-4.27-html5-es3>Setup.bat
Checking dependencies...
Updating dependencies:   0% (0/64293)...
Failed to download 'http://cdn.unrealengine.com/dependencies/2605550-2722e8035d7444a18952cbd04a5c58c7/0104416c142ca7b3174660267c22f049db573bdb': The remote server returned an error: (403) Forbidden. (WebException)
Press any key to continue . . .

https://forums.unrealengine.com/t/upcoming-disruption-of-service-impacting-unreal-engine-users-on-github/1155880

UPDATE:

For Unreal Engine 4.25 and later, you should be able to successfully pull from the official release branch or you may optionally replace the XML file, as described below. Any release older than that, you must replace the XML file to successfully download the data required to build and run the engine.

–

To remedy the error in the builds, a new Commit.gitdeps.xml file has been attached to each release version as an asset. Please replace the existing Engine/Build/Commit.gitdeps.xml file with the new asset.

The complete list of releases with new XML files: 4.11.0-5.1.1

for convenience https://github.com/EpicGames/UnrealEngine/releases/download/4.27.2-release/Commit.gitdeps.xml

replace it in ue-4.27-html5-es3\Engine\Build

$ ./HTML5Setup.sh
./HTML5Setup.sh: line 24: cmake: command not found

In case CMake is installed via Visual Studio 2022
PATH=/c/Program\ Files/Microsoft\ Visual\ Studio/2022/Community/Common7/IDE/CommonExtensions/Microsoft/CMake/CMake/bin/:$PATH
Use this in the git bash prompt

Python was not found; run without arguments to install from the Microsoft Store, or disable this shortcut from Settings > Manage App Execution Aliases.

then if python is installed via windows store
turn off the aliases as per
https://stackoverflow.com/questions/65348890/python-was-not-found-run-without-arguments-to-install-from-the-microsoft-store

-bash: cd: -b: invalid option
cd: usage: cd [-L|[-P [-e]] [-@]] [dir]
Engine/Platforms/HTML5/Build/PatchFiles/4.27.2.engine.patch:19: trailing whitespace.

Engine/Platforms/HTML5/Build/PatchFiles/4.27.2.engine.patch:29: trailing whitespace.

Engine/Platforms/HTML5/Build/PatchFiles/4.27.2.engine.patch:260: trailing whitespace.
                "Lumin",
Engine/Platforms/HTML5/Build/PatchFiles/4.27.2.engine.patch:428: trailing whitespace.

Engine/Platforms/HTML5/Build/PatchFiles/4.27.2.engine.patch:513: trailing whitespace.

warning: squelched 23 whitespace errors
warning: 28 lines add whitespace errors.
/mnt/d/dev/ue-4.27-html5-es3/Engine/Platforms/HTML5
Resolving SDK version '3.1.37' to 'sdk-releases-7c905cfc1ca6699f6ccb288ae174902cfbdcf0a2-64bit'
error: error: tool is not installed and therefore cannot be activated: 'node-15.14.0-64bit'

If getting this issue with tool not being installed and specifying nodejs.... It's because the HTML5Setup script had already cloned/downloaded the repo and attempted to install emsdk once, but failed when trying to find cmake or python. Since it didn't cleanup files it's in a bad state.
The workaround or fix is to just delete the emsdk folder in ue-4.27-html5-es3\Engine\Platforms\HTML5\Build\ and rerun HTML5Setup.sh

if when building the html5 for a new project and it complains about langversion, maybe close and reopen editor? and if automation cs files complain about syntax,... rebuild automation tool:
https://forums.unrealengine.com/t/unreal-engine-version-4-27-2-i-get-an-error-when-trying-to-package-any-project/270627/12

[SpeculativeCoder]

Thank you for the very detailed steps to clone, and build it for 4.27.2

Thanks @JCBuck - glad also you were able to work past the various issues you encountered.

[SpeculativeCoder]

Updated to emscripten 3.1.39

As part of this work I have updated the documentation page at https://github.com/SpeculativeCoder/UnrealEngine-HTML5-ES3 to include links to the official Epic Games fix(es) for the recent git dependencies issue (the fix is needed for any fresh installs). The info about the fix was added to the Installation section.

[Mootbing]

can you enable issues on your repo so I can ask questions there?

[JCBuck]

I'm not too familiar with cmake, but in effort to run HTML5Setup faster... is it okay to change the -j 1 to -j 32 for a 16C/32T CPU?
It seems to run faster, but I'm not sure if there are any implications of correctness if doing so

[Mootbing]

Can we also get a discord server running

[SpeculativeCoder]

can you enable issues on your repo so I can ask questions there?

Hi @Mootbing, there are some links to Issues / Discussions location (on the fork) here:
https://github.com/SpeculativeCoder/UnrealEngine-HTML5-ES3#issues--discussions

[SpeculativeCoder]

I'm not too familiar with cmake, but in effort to run HTML5Setup faster... is it okay to change the -j 1 to -j 32 for a 16C/32T CPU? It seems to run faster, but I'm not sure if there are any implications of correctness if doing so

There was an intermittent failure during these parallel builds which would randomly cause the libraries to not be built (or corrupted). It was rare but happening to me a few times for sure and I saw discussions on the web about it possibily being exacerbated by parallel builds so went with the safest option for reliability and havn't had the problem since.

However for yourself if you are confident you can recover from the issue when it happens (the HTML5 packaging would probably error out complaining about some third party library) you could take the risk locally for massive speed increase of setup.

However I am also not aware / investigated if the issue was eventually fixed upstream.

[Mootbing]

can you enable issues on your repo so I can ask questions there?

Hi @Mootbing, there are some links to Issues / Discussions location (on the fork) here: https://github.com/SpeculativeCoder/UnrealEngine-HTML5-ES3#issues--discussions

Can we still have a discord server? would be helpful and esp for maintaining the repo postmortum