One of the ways we have for distributing our Unity games is via the web using WebGL. Compiling our game for WebGL is as simple as choosing WebGL as the build platform.
Well, mostly… if you have the Color Space set to Linear, you may see the following error.
Depending on your intended target, you can either uncheck the Auto Graphics API box, or you can set the Color Space to ‘Gamma’ instead.
Depending on the web server you are deploying to, you may get the following error.
With this you have a few choices. The first is to follow the advice given and configure your web server accordingly. If that is not possible then you have a choice of changing one of two other build options. Both are in Player Settings -> Publishing Settings.
If you set the Compression Format to ‘disabled’ then no further configuration change should be needed. From the full-disclosure-department, I tested neither of these. The option I chose was to check the Decompression Fallback option which bundles a JavaScript decompressor with your build.
Once you have a build, you can run it. Unfortunately, you can’t just point a browser at the index.html file. Sadly, in the browser’s ongoing effort to protect us from ourselves, WebGL won’t just fire up when accessed directly from the file system. It must be served up from an actual web server of some sort.
Standard Web Server
There are multiple ways to serve up your application. The easiest way to do so on your local machine is to use the “Build and Run” option. This actually fires up a local web server and points it at your build directory.
Depending on your desired workflow, you can of course install any number of small, or large web servers on your local workstation, or you can use a web hosting service. Regardless of your choice, the entire build directory must be copied to the web server. This will be a collection of files, and two directories.
With my hosting service, I was able to use the hosting service’s tools, in this case cPanel to upload the files to my web server. As you can see, they are in the public_html directory (common on many web servers). Furthermore, I created a ‘unity’ directory and then another directory for the particular game. These are both arbitrary and intended only to keep things neat and tidy.
Your application is now ready to be served up with its very own URL! On most servers, this would be something like https://example.com/unity/snowballs_chance/index.html.
Unity Play
If you don’t want to mess with managing your own web server, Unity provides another option. When you created your Unity account it gave you access to the whole Unity ecosystem. This includes the Unity Play site (https://play.unity.com/en).
There are two ways you can upload content here. One is to upload through the website.
You will need to zip the build directory and then just drop it on the upload page. But you can also do it through the Unity Editor. You will need to enable the WebGL Publisher package through Window -> Package Manager -> Unity Registry -> WebGL Publisher. Simply click the Install button. This will add a new item to the top menu.
Selecting Publish -> WebGL Project will bring up a new dialog.
Once a project is uploaded you can set a few things, either while uploading or later with the edit option for the game in your Unity Play account. Changing the application name will also change the custom URL.
WordPress
If you happen to have a WordPress site and want to display it within the WordPress themed web pages you will need to do a little bit of trickery. Once you create the page, add a Custom HTML block and add an iframe tag similar to the one below. The width and height values come from the index.html file created by the build process. They should match values in the File -> Build Settings -> Player Settings -> Resolution and Presentation section. In my case, I increased the height by 50 pixels to account for the frame
<center>
<iframe id=""
src="https://doersofstuff.org/unity/snowballs_chance/"
name="Snowball's Chance..."
width="960"
height="650"
frameborder="0"
marginheight="0"
scrolling="no">
</iframe>
</center>Monetizing sites
Finally, there are quite a few sites targeted at helping developers monetize their games and build a community around them. Even Unity has one. Some of these sites are paid, some free and some with paid and free tiers. Because they are competing for YOUR attention, expect the terms and features to change quite often as each tries to outdo the others. Some fairly well-known options currently include:
- Unity Cloud (https://cloud.unity.com/)
- Itch.io (https://itch.io/)
- Simmer.io (https://simmer.io/)
- Game Jolt! (https://gamejolt.com/)
- Game Pipe (https://gamepipe.io/)
- Kongregate (https://www.kongregate.com/)
- New Grounds (https://www.newgrounds.com/)
Again, each will have its own terms, features and processes, so look at them. Some of them may allow multiple formats as well. Steam (as far as I can tell) does not allow WebGL but does allow for other formats.
All in all, there are many ways to get your work out there. More sophisticated hosting sites will even allow for marketing, demos, limited beta testing, etc.