Web Hosting Quick Fix for Facebook Gameroom with Unity and WebGL

I was looking for options to publish my Unity demos as WebGL to make it interactive and got to read about Facebook web games hosting.  It’s not a general purpose solution to publish web samples (the game needs to go through an approval process before being publicly available) compared to hosting your own web server but it allows for the game to run on a web browser and the Facebook Gameroom client.  This platform provides a later option as a desktop experience if I want to switch-out from WebGL.

I’m using the following versions:

Unity Version – 2017.3.0f3
UnitySetup-UWP-IL2CPP-Support-for-Editor-2017.3.0f3
UnitySetup-WebGL-Support-for-Editor-2017.3.0f3
UnitySetup-Facebook-Games-Support-for-Editor-2017.3.0f3
Windows 10 (10.0.16299)

The instructions on Unity and Facebook are relatively simple to follow, it took me some time to find the “web hosting” project option since it would only show up if the app is defined as a “game”. The main issue (as of writing this post) I encountered was on using the Unity “Upload latest build to Facebook” which uploads the project zip to Facebook and shows up on the app Dashboard but does not run the WebGL package. I can even download the .zip package and run on my local workstation, just not on the Facebook link.

FBWebGL1

The solution for me was to manually ZIP (using File Explorer/Send To/Compressed zipped Folder) the WebGL Build folder and upload the file through the app dashboard and it worked.

I downloaded the working (manual zipped) and non-working (Unity zipped) from the app dashboard to do a file and structure comparison using Beyond Compare and they are identical in file content and structure but not in .zip binaries. I guess the zip packaging through Unity had enough variation that it didn’t work with the web hosting setup.

FBWebGL3

Sharing this fix to unblock other developers who may encounter a similar issue.  It was nice to see my sample WebGL app working on a Facebook link and Gameroom which supports a full screen view.

FBWebGL4

FBWebGL5

For questions, comments or contact – follow/message me on Twitter @rlozada