Firebase Hosting and Unity 2020 WebGL Projects

[Alex Ferrier]

We are using Firebase hosting to host a Unity 2020 WebGL project. By default, a Unity 2020.3 (LTS) WebGL build will run successfully when served from a local Unity Editor, but fails to run at all when deployed to Firebase Hosting. I appreciate that this question straddles a line between Firebase and Unity, so I'm going to attempt to ask the most specific questions possible in the hope somebody can clarify. There are no google hits which imply anyone is successfully hosting a Firebase Unity 2020 WebGL project using Firebase hosting (which seems like it should be happening) and information is limited, e.g. this unanswered question here which I'll try to be more specific than: 

https://groups.google.com/g/firebase-talk/c/520ieDghf1w/m/xjSRANjyBgAJ

On migration to Unity 2020.3 LTS, using the default "GZip Compression", a build deployed to Firebase Hosting (via the minimum friction path of copying the build output folder to your public folder) will no longer load. Viewing the chrome debug console reveals that it has crashed on startup with: 

/WebGLMacRelease/Bui…e.framework.js.gz:1 Uncaught SyntaxError: Invalid or unexpected token

I suspect this is because hosting configuration is not set up correctly, so I attempted to add the headers documented at this link to the hosting section of firebase.json. 

https://docs.unity3d.com/2021.1/Documentation/Manual/webgl-deploying.html

1. {
2.   "hosting": {
3.     "public": "public",
4.     "ignore": [
5.       "firebase.json",
6.       "**/.*",
7.       "**/node_modules/**"
8.     ]
9.   },
10.     "headers": [
11.     {
12.       "source": "**/*.gz",
13.       "headers": [
14.         {
15.           "key": "Content-Encoding",
16.           "value": "gzip"
17.         }
18.       ]
19.     }
20.   ]
21. }

However, this doesn't seem to stop the problem, and I did not manage to write any version of firebase.json (including permutations of wildcards, and adding Content-Type headers) which resulted in a successfully loading project. 

It seems that if we only care about modern desktop browsers (specifically, Safari and Chromium-derivatives like Chrome and the new Edge) the best thing to do is to disable Unity compression altogether, and let firebase hosting perform the gzip (and potentially Brotli) compression for us? I can confirm that this works. So, questions: 

(1) Is it by design that I can't make a firebase.json that adds the correct extensions? Does anybody have an example that works? 

(2) Is it reasonable best-practice if using Firebase hosting, and assuming "modern" desktop browsers just to disable Unity's Gzip compression and let Firebase hosting handle the compression, with the browser performing browser-native decompression? 

(Full disclosure: This was also posted to the Unity forum as https://forum.unity.com/threads/webgl-hanging-on-firebase-hosted-webapp-with-2020-3.1076987/) 

[martin...@google.com]

After some investigation, I've found that disabling compression is the best route forward for hosting a game on Firebase Hosting (short of maybe manually moving stuff onto storage and using that to serve up large blobs of data, but that would require some custom tooling).

Hosting performs static compression server side and should deliver assets in the most efficient way possible (using either gzip or brotli) based both on the content and the "Accept-Encoding" header (note that this is the scenario called out explicitly here for disabling compression). I can't say for certain why the header overrides were failing for you, and haven't fully investigated what headers get sent when (ex: for .js.gz or .js.br, which you may have to include as well for "Content-Type: application/javascript") -- but the ideal solution should be to disable compression and let Firebase handle it.