Unity_WebGL相关

时间 2020-08-01

标签 unity webgl 相关繁體版

原文原文链接

先说个题外的
ajax遇到跨域问题（我用jquery）html

$.ajax({
    url:url,
    dataType:"jsonp",
    type:"GET",
    success:function(msg)
    {
        //......
    }
});

要用jsonp和get
在ajax请求后得到的数据，用JSON.parse来转换json，若是报错了，那有多是传过来的数据里有非法字符，好比中文符号之之类的jquery

再次总结一下Unity WebGL下C#与JS交互一些基本web

1、从页面上用js调取Unity中的方法ajax

gameInstance.SendMessage("GameObjectName", "FunctionName", param);

要调用Unity场景中的某个方法就要知道这个方法所在脚本挂在哪一个物体上，须要这个物体的名字，也就是第一个参数GameObjectName，而后FunctionName就是这个方法的方法名，最后是传的参数json

我试过真接用ajax，success接收到的数据直接做为第三个参数传，会报错，说不能传这个类型的，而这个类型应该是js里的objectcanvas

$.ajax({
    url:url,
    type:"post",
    success:function(msg)
    {
        gameInstance.SendMessage("GOName", "FName", msg);
    }
});

如上就会报错。
获得的msg应该是一个json串，可是想用以前的JSON.parse转换成json字符串也报错，不过能够把msg里的元素直接点出来，好比
msg.name,msg.id……
因此最后是手动拼的json串跨域

var str='{"name":"'+msg.name+'","id":"'+msg.id+'"}';
gameInstance.SendMessage("GOName", "FName", str);

这样才成功浏览器

2、Unity中调取js中的方法ide

Application.ExternalCall("JSFunctionName", params[]);

虽然在新版本的Unity中（具体从哪一个版本开始没注意）
Application.ExternalCall就弃用了，但我仍是习惯用这个，反正也能运行
而新的jslib的方式，以前也试过，用不惯……函数

3、让Unity发布出的程序随页面缩放，即自适应
发布出来的WebGL程序有一个index.html，在里面加些东西，改些东西就好了

<script>
    var gameInstance = UnityLoader.instantiate("gameContainer", "Build/WebStudy.json", {onProgress: UnityProgress});
</script>

上面这行是固定有的，定义了gameInstace
在它下面再添加一个script标签，里面填上咱们须要的js代码

<script>
function Reset()
        {
            var canvas=document.getElementById("#canvas");
            canvas.height=document.documentElement.clientHeight;
            canvas.width=document.documentElement.clientWidth;
        }
</script>

也就是建了一个叫Reset的函数
这里以canvas为id的组件是在运行以后生成的

而这个reset方法要在运行开始时，和改变浏览器窗口大小时起做用
因而

<body onload="Reset()" onresize="Reset()">

而原先的主界面的div，也要改一改

<div class="webgl-content" style="width:100%;height:100%">
    <div id="gameContainer" style="width:100%; height:100%">

即最外面的div里加上style，让width和height都是100%，在其下的gameContainer中，将原先固定像素数的width和height也改为100%。这样所有改完以后，再运行页面，就是占满整个浏览器窗口，并且自适应。若是不想占满，须要调整Reset方法里canvas的width和height，同时也要调整gameContainer的style，并且两边要一至。