unity WebGL 在移动端浏览器全屏自适应Build模板

unity在发布Web端全屏时，在手机上浏览器上只能横屏或者竖屏能正常显示，后来发现是手机上浏览器要设置viewport就写了这个模板

这里是模板下载链接：https://download.csdn.net/download/weixin_44250118/19119916

index.html

关于viewport的设置

移动前端开发之viewport的深入理解

content属性值 :

     width:可视区域的宽度，值可为数字或关键词device-width

     height:同width

     intial-scale:页面首次被显示是可视区域的缩放级别，取值1.0则页面按实际尺寸显示，无任何缩放

     maximum-scale=1.0, minimum-scale=1.0;可视区域的缩放级别，

              maximum-scale用户可将页面放大的程序，1.0将禁止用户放大到实际尺寸之上。

     user-scalable:是否可对页面进行缩放，no 禁止缩放

 

 

上面一行保证无论是加载界面还是对浏览器进行尺寸更改都调用FitScreen方法对游戏进行全屏显示或者等比例缩放游戏画面

关于手机浏览器警告

更改发布之后的文件中的部分代码，下面代码就是在unity中发布完成后自动更改包体中文件的方法：

public class PostBuildHandler
{
    [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);
    }

}

更改加载界面和标题栏的ico

如上图所示替换里面的图片依次是改变：标题栏icon、加载进度条底图、进度条、加载界面图标