使用的是2022.1.10版本的Unity
一、首先是Project Settings中的配置如下，可以解决一开始的报错，注意：PWA模板在2020版本中是没有的。
二、网页在浏览器中显示时，想要全屏，可以使用PWA模板，但是会有下拉条的出现，需要在导出后，在TemplateData文件中，找到style.css，打开后，在最下方输入下方的代码，即可全屏。
html,body{width:100%;height:100%;margin:0;padding:0;overflow:hidden;}
.webgl-content{width: 100%; height: 100%;}
.unityContainer{width: 100%; height: 100%;}
如图所示
三、在浏览器中显示时，标题上前面会显示“Unity WebGL Player | ”，在导出的文件中找到index.html，如下图，删掉即可。
四、要修改LOGO，可以在模板中路径的TemplateData文件夹中修改，模板路径为XX版本\Editor\Data\PlaybackEngines\WebGLSupport\BuildTools\WebGLTemplates。替换就行。或者导出后进行修改。
五、正常情况下在Input Field控件中，无法切换中文输入法，可下载“WebGLSupport.unitypackage”，把WebGLInput脚本拖到 Input Field 上即可。
Release Release · kou-yeung/WebGLInput · GitHub
六、WebGl中无法使用 System.Net.Http;、System.Threading.Tasks;，其它的还在研究中。
七、WebGl中无法使用DLL，还在找方法中。
八、WebGl无法直接打开浏览本地文件的窗口，先在Unity中创建如下脚本
using UnityEngine;
using UnityEngine.UI;
using TMPro;
public class FileOpener : MonoBehaviour
{
public TMP_InputField urlInputField;
private void Start()
{
}
public void OpenFile()
{
// 调用JavaScript函数打开文件选择窗口
Application.ExternalCall("OpenFile");
}
// 从JavaScript获取文件信息
public void GetFileInfo(string fileInfo)
{
urlInputField.text = fileInfo;
Debug.Log("Selected file: " + fileInfo);
}
}
并且绑定在GameManager物体中
在Button按钮中绑定OpenFile。
随后在<script></script>块中，找到这个位置
loadingBar.style.display = "block";
var script = document.createElement("script");
script.src = loaderUrl;
script.onload = () => {
createUnityInstance(canvas, config, (progress) => {
progressBarFull.style.width = 100 * progress + "%";
}).then((unityInstance) => {
loadingBar.style.display = "none";
}).catch((message) => {
alert(message);
});
};
document.body.appendChild(script);
</script>
</body>
</html>
改成如下代码，其中GameManager为脚本绑定的物体。
需要注意的是file无法获取到路径，只能获取到名称、大小和类型。
loadingBar.style.display = "block";
var myGameInstance = null;
var script = document.createElement("script");
script.src = loaderUrl;
script.onload = () => {
createUnityInstance(canvas, config, (progress) => {
progressBarFull.style.width = 100 * progress + "%";
}).then((unityInstance) => {
loadingBar.style.display = "none";
myGameInstance = unityInstance;
}).catch((message) => {
alert(message);
});
};
document.body.appendChild(script);
// JavaScript代码
function OpenFile() {
var fileInput = document.createElement("input");
fileInput.type = "file";
fileInput.addEventListener("change", function(event) {
var file = event.target.files[0]; // 只处理第一个被选择的文件
var fileInfo = {
name: file.name,
size: file.size,
type: file.type,
};
// 将文件信息传递给Unity
myGameInstance.SendMessage("GameManager", "GetFileInfo", JSON.stringify(fileInfo));
});
fileInput.click();
}
</script>
</body>
</html>
网上有些是下面这种的，但是UnityLoader缺少unityloader.js，webgl.json也没有描述是什么文件，就不知道怎么用了，不过新版好像已经不用UnityLoader了。
var gameInstance = UnityLoader.instantiate("gameContainer", "Build/Webgl.json",
//发送给unity
gameInstance.SendMessage("TestObj", "GetBase64", s);
九、如果要去掉Web打开时的进度条，去掉下面两张图上红框中的代码就行。
十、正在研究怎么上传文件到阿里云的OSS上，参考链接如下，有结果的可以交流下
如何进行服务端签名直传_对象存储(OSS)-阿里云帮助中心
十一、获取今日天气
可使用高德的免费天气查询API，如何开通并获取key，请参考下方链接
Unity 接入天气系统_unity天气系统-CSDN博客
具体实现方法及解析方法如下：
using System.Collections;
using UnityEngine;
using UnityEngine.Networking;
using System.Collections.Generic;
public class GetWeather : MonoBehaviour
{
public void Awake()
{
StartCoroutine(GetFutureWeatherInfoNew());
}
#region 输入城市，获取今日天气
/// <summary>
/// API接口文档：https://lbs.amap.com/api/webservice/guide/api/weatherinfo
/// </summary>
IEnumerator GetFutureWeatherInfoNew()
{
var publicIpReq = new UnityWebRequest($"https://restapi.amap.com/v3/weather/weatherInfo?city=citykey&key=api_key&extensions=base&output=JSON", UnityWebRequest.kHttpVerbGET);
publicIpReq.downloadHandler = new DownloadHandlerBuffer();
yield return publicIpReq.SendWebRequest();
if (!string.IsNullOrEmpty(publicIpReq.error))
{
Debug.Log($"获取今日天气失败：{publicIpReq.error}");
yield break;
}
var info = publicIpReq.downloadHandler.text;
Debug.Log(info);
//json解析
var resData = JsonUtility.FromJson<FutureWeatherData>(info);
Debug.Log($"weather:{resData.lives[0].weather}|temperature:{resData.lives[0].temperature}|winddirection:{resData.lives[0].winddirection}");
}
#region 用于接收天气返回值json的反序列化数据
[System.Serializable]
public class FutureWeatherData
{
public int status;
public int count;
public string info;
public int infocode;
public List<FutureData> lives;
}
[System.Serializable]
public class FutureData
{
public string province;
public string city;
public string adcode;
public string weather;
public string temperature;
public string winddirection;
public string windpower;
public string humidity;
public string reporttime;
public string temperature_float;
public string humidity_float;
}
#endregion
#endregion
}
代码中的city=citykey&key=api_key，需要自行填写，city为城市编码，可在下面链接中下载查询。
https://a.amap.com/lbs/static/code_resource/AMap_adcode_citycode.zip
如果要获取预报信息，extensions中的base改成all。
十二、想要在浏览器上查看的话，可以使用Nginx，下载地址如下：
下载完成后，解压缩。文件如下。注意不要直接双击打开nginx.exe。需要用批处理的方式进行打开。
首先新建两个批处理，启动和重载
启动.bat里的内容如下，打开后就即启动了nginx。
chcp 65001
@echo off
echo 当前目录：%CD%
start nginx.exe
echo 启动成功......
pause
启动正常是这样的
重载.bat里的内容如下，打开后就即重新启动了nginx。
chcp 65001
@echo off
echo 当前目录：%CD%
.\nginx.exe -s reload
echo 已重载......
pause
重载正常是这样的
随后，打开conf文件夹，找到nginx.conf，以记事本方式打开。在以下位置添加框中的代码，其中root 后面的是路径，可自行修改。
server {
listen 9099;
server_name localhost;#charset koi8-r; #access_log logs/host.access.log main; location / { root D:\\测试\\WebGl; index index.html index.htm; }}
修改完成后保存。随后打开启动.bat，在浏览器中输入：http://本机IP地址:9099/。即可浏览导出的内容。IP地址不能输入127.0.0.1。
十三、在浏览器查看时，如果没有显示或者报错。可按F12查看报错，并切换到控制台菜单栏，点击其中的报错，可查看报错的代码。
持续更新中。。。。。。
版权归原作者 zhangllchll 所有， 如有侵权，请联系我们删除。