Unity发布WebGL如何实现自动化？

洪流学堂，让你快人几步。

洪流学堂公众号回复webgl可获取WebGL自动化构建工具。

---

大智：“小新，走啊，撸串去！”

小新：“等我啊，马上，我发个版本”

大智：“好”

大智等了10分钟，又过了10分钟，又又过了10分钟，终于忍不了了。

大智：“你发布啥玩意呢？半小时了，还没搞定？”

小新：“最近我在搞WebGL的东西，每次发布都头大，发布出来还得改一堆东西，每次还容易改错。”

大智：“问题都有啥？”

小新：“主要吧有这么两个：”

• 一个是需要全屏，所以需要修改发布出来的Html文件
• 一个是在手机上运行有warning警告，每次得想办法删掉

大智：“这也不是啥大问题啊，身为程序员，应该用程序员的思维来解决问题，就是自动化和工具化。我先教你如何渔，最后我再给你个渔具。”

WebGL自适应全屏

WebGl的自适应全屏，在网上搜索出来很多办法都是告诉你如何修改html文件，这个是改起来最简单的。

但是你能不能深入思考一下，如何不用每次发布都改Html文件呢？如何其他项目发布也不需要修改Html文件呢？

你就会发现解决这个问题可以使用WebGL Templates解决，只要写好了WebGL发布的模板，这个问题就能迎刃而解。

官方文档在这：https://docs.unity3d.com/Manual/webgl-templates.html

一会我会给你一个写好的模板，只要在Player Settings里面选择这个模板就可以了。

WebGL移动端警告的问题

Unity的WebGL官方不支持移动端运行，但是目前市面上大多数的手机都可以很好地运行WebGL的网页程序。但是Unity发布出来的网页在手机上运行会有警告：

Please note that Unity WebGL is not currently supported on mobiles. Press OK if you wish to continue anyway.

在iOS上，搞定上面的警告以后，还会有另外一个警告：

Please note that your browser is not currently supported for this Unity WebGL content. Press OK if you wish to continue anyway.

那对于烦人的警告如何去掉呢？当然，在网上搜索都能找到答案：
答案是将UnityLoader.js中的UnityLoader.SystemInfo.mobile和["Edge", "Firefox", "Chrome", "Safari"].indexOf(UnityLoader.SystemInfo.browser) == -1替换成false。

那回到我们的问题，如何自动化呢？

那就需要用到PostProcessBuild后处理脚本了，需要放到Editor文件夹内，脚本内容如下：

using System.IO;
using UnityEditor;
using UnityEditor.Callbacks;

public class PostBuildActions
{
    [PostProcessBuild]
    public static void OnPostProcessBuild(BuildTarget target, string targetPath)
    {
        if (target != BuildTarget.WebGL) return;

        var path = Path.Combine(targetPath, "Build/UnityLoader.js");
        var text = File.ReadAllText(path);
        text = text.Replace("UnityLoader.SystemInfo.mobile", "false");
        text = text.Replace("[\"Edge\", \"Firefox\", \"Chrome\", \"Safari\"].indexOf(UnityLoader.SystemInfo.browser) == -1", "false");
        File.WriteAllText(path, text);
    }
}

这个脚本很简单，主要功能就是在Unity的构建工作完成后，对目标文件中的内容进行替换。

总结

小新：“智哥，说了这么一大堆，你说好的渔具嘞？”

大智：“哎你小子，这呢，接着！不要只用渔具，多想想制作一些渔具啊！”

小新：“知道啦！”

洪流学堂公众号回复webgl可获取WebGL自动化构建工具。

推荐阅读

• 使用LeanCloud实现玩家注册
• 使用LeanCloud实现玩家登陆
• Unity开发《一起来捉妖》教程 | 1.陀螺仪控制相机
• Unity开发《一起来捉妖》教程 | 2.用摄像头图像做背景
• Unity2019更新规划速览，将有官方的可视化编程！

洪流学堂公众号回复webgl可获取WebGL自动化构建工具。

《大话Unity2019》，大智带小新学Unity2019的有趣经历，让你学Unity更简单。