{"id":41,"date":"2015-04-27T02:58:08","date_gmt":"2015-04-27T02:58:08","guid":{"rendered":"https:\/\/ocias.com\/blog\/?p=41"},"modified":"2015-12-30T17:10:42","modified_gmt":"2015-12-30T06:10:42","slug":"how-to-upload-unity-webgl-content","status":"publish","type":"post","link":"https:\/\/ocias.com\/blog\/how-to-upload-unity-webgl-content\/","title":{"rendered":"How to Upload Unity WebGL Content"},"content":{"rendered":"<p>Chrome killed NPAPI, meaning like 60% of your audience has no Unity web player&#8230; and Unity\u00a0WebGL is still in &#8220;preview&#8221; mode. Oh well time to ship anyway!<\/p>\n<p><!--more--><\/p>\n<p><strong>Update December 2015: Unity 5.3 has simplified WebGL builds quite a bit. Up should be able to just uncheck &#8220;development build&#8221;, build and upload the whole resulting directory. If you&#8217;re on an older version of Unity, or are running into a problem, read on&#8230;<\/strong><\/p>\n<p>But the process to upload unity webGL games is actually a bit tricky and no-one&#8217;s had any time to iron out the common issues. It&#8217;s super important that the release version uses the &#8220;Compressed&#8221; versions of the game data, both to reduce the game size by half or so and at least to save your server trouble compressing the files. After some mucking around, here&#8217;s the process that worked for me and my mod_rewrite-enabled hosting server:<\/p>\n<ol>\n<li>Delete release sub-folder.<\/li>\n<li>Upload the whole build folder.<\/li>\n<\/ol>\n<p>Simple in theory, if nothing goes wrong.<\/p>\n<p>If you&#8217;re uploading to someone else&#8217;s server, like itch.io or Kongregate, the .htaccess file will probably be ignored, so you can&#8217;t delete the release folder (but rather, you can probably delete the compressed folder).<\/p>\n<h2>Settings for a Release Build<\/h2>\n<p>To make sure things go smoothly and file sizes are super tidy and low, just make sure these things are sorted before you hit that trusty &#8220;Build and Run&#8221; button:<\/p>\n<ul>\n<li>Build Settings: Optimization Level set to &#8220;Fastest (very slow builds)&#8221;<\/li>\n<li>Player Settings: Other Settings: Stripping Level set to\u00a0&#8220;Use micro mscorlib&#8221; (anything other than &#8220;Disabled&#8221; should have an equal effect I believe)<\/li>\n<li>Player Settings: Enable Exceptions: None<\/li>\n<li>Memory set to the lowest you need it (use a development build and connect the profiler to find the highest number it goes up to)<\/li>\n<\/ul>\n<h2>WebGL Build Folder Structure<\/h2>\n<p>When you build using the default template you\u00a0get a thing that looks like:<\/p>\n<pre class=\"\">.htaccess\r\n- Compressed\r\nindex.html\r\n- Release\r\n- TemplateData<\/pre>\n<p>Let&#8217;s look at each of these files:<\/p>\n<ul>\n<li>.htaccess: tells the server to send\u00a0the compressed files when a client asks for the release game files. This file is invisible, on OS X you can make it visible by either using the <a href=\"http:\/\/sweetpproductions.com\/desktoputility\/\" target=\"_blank\">Desktop Utility menu<\/a> or <a href=\"http:\/\/ianlunn.co.uk\/articles\/quickly-showhide-hidden-files-mac-os-x-mavericks\/\" target=\"_blank\">by a terminal command<\/a>.<\/li>\n<li>Compressed: a folder of gzipped game data.<\/li>\n<li>index.html: the page in question.<\/li>\n<li>Release: the uncompressed game files.<\/li>\n<li>TemplateData: files related to the appearance and presentation of the page.<\/li>\n<\/ul>\n<p>If\u00a0your server is configured ideally, you should be able to upload the whole folder and delete the Release folder and have everything work.<\/p>\n<h2>Extra Tips and Pitfalls<\/h2>\n<ul>\n<li>.htaccess works in every folder, not just the root. I made the mistake of trying to move the .htaccess file to the root &#8211; don&#8217;t do this! Keep the .htaccess unity generates together with the other files, don&#8217;t overwrite your root .htaccess file.<\/li>\n<li>That said, you can copy the contents of the unity-generated .htaccess file into your site&#8217;s root .htaccess and it should work fine.<\/li>\n<li>If your server does not allow the mod_rewrite used in the .htaccess file, then you must upload the release folder!<\/li>\n<li>WebGL has no access to system fonts, make sure every font you want to use is an asset!<\/li>\n<li>Also, don&#8217;t use Bold on fonts anywhere unless you also have the Bold variant asset included &#8211; webGL will horizontally scale every letter, wrecking your day.<\/li>\n<li>Your build will probably have a bunch of warnings in the browser&#8217;s console about mip-maps. What this is saying is that image effects you have on your camera cannot create mip-maps levels.\u00a0You can usually just ignore this.\u00a0Although speaking of mip-maps, if you run into memory problems, remember it is an option to go through and switch off mip-maps on all of your textures.<\/li>\n<\/ul>\n<p>Did something else go wrong? <a href=\"https:\/\/ocias.com\/contact.php\">Send me an email<\/a> or leave a comment and I&#8217;ll try to help you!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Chrome killed NPAPI, meaning like 60% of your audience has no Unity web player&#8230; and Unity\u00a0WebGL is still in &#8220;preview&#8221; mode. Oh well time to ship anyway!<\/p>\n","protected":false},"author":1,"featured_media":71,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"inline_featured_image":false,"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"categories":[1],"tags":[9,3,10],"class_list":["post-41","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-uncategorised","tag-tutorial","tag-unity3d","tag-webgl"],"_links":{"self":[{"href":"https:\/\/ocias.com\/blog\/wp-json\/wp\/v2\/posts\/41","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ocias.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ocias.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ocias.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ocias.com\/blog\/wp-json\/wp\/v2\/comments?post=41"}],"version-history":[{"count":10,"href":"https:\/\/ocias.com\/blog\/wp-json\/wp\/v2\/posts\/41\/revisions"}],"predecessor-version":[{"id":243,"href":"https:\/\/ocias.com\/blog\/wp-json\/wp\/v2\/posts\/41\/revisions\/243"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/ocias.com\/blog\/wp-json\/wp\/v2\/media\/71"}],"wp:attachment":[{"href":"https:\/\/ocias.com\/blog\/wp-json\/wp\/v2\/media?parent=41"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ocias.com\/blog\/wp-json\/wp\/v2\/categories?post=41"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ocias.com\/blog\/wp-json\/wp\/v2\/tags?post=41"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}