以下內容將和大家詳細分享 Unity 在 WebGL平臺的發布方法、 如何去除unity的Logo和加載界面、 WebGL與網路端通信 、以及 如何在本地運行html，
目錄
- 一、Unity在 WebGL平臺的發布方法
- 二、如何去除unity的Logo、加載界面、進度條
- 1、去掉Logo
- 2、去掉加載界面進度條
- 三、WebGL與網路端通信
- 四、如何在本地運行html
一、Unity在 WebGL平臺的發布方法
1、如下圖，選擇webgl平臺，沒安裝的點擊下載安裝
安裝后如圖
選擇需要打包的場景，無特殊要求則可以直接點擊Build打包專案，會生成如下三個檔案，則發布成功，
如果想直接運行看效果，則可以選擇Build And Run，打包結束時會自動打開網頁運行此專案，
或者安裝火狐游覽器，雙擊打包生成的html檔案運行專案，
.
二、如何去除unity的Logo、加載界面、進度條
上面簡單說了下打包步驟，但是大家會發現開始運行時加載界面帶有unity進度條和Logo，
如何去掉呢？
首先當然得擁有付費賬號，或者 emmm，不會的私我，才能有權限關閉這些東西，
1、去掉Logo
如下圖，關閉Splash Image去除Made with Unity啟影片面，即可關閉Logo，
（在File->Build Settings->Player Settings->Splash Image->Show Splash Screen）
2、去掉加載界面進度條
在Unity官方檔案中查詢WebGL Template（https://docs.unity3d.com/Manual/webgl-templates.html），找到這個主題
根據檔案的例子，我們有兩種方式來去掉或者自定義載入條：
- 直接修改默認模板default或者minimal（不建議）
根據檔案里說的，Unity內置的兩種模板都可以在Unity的安裝路徑中找到，這里我們選擇default這個默認模板，打開檔案夾
接下來進入TemplateData這個檔案夾里找到UnityProgress.js這個檔案
這個檔案的onProgress方法定義了整個進度條，包括了Logo的生成，進度條的生成，進度條的進度等，這里我們可以把進度條修改成自己需要的樣式，如果單純地想去掉它，把方法體{ …}里面的內容都刪掉就可以了
通過這個方法修改了系統自帶的模板，對以后發布的每一個專案都有影響，所以不太建議使用這種方法，
- 自定義一個WebGL Template
Unity提供了一個自定義WebGL模板的方法，步驟如下：
（1） 在Assets檔案夾下新建一個檔案夾WebGLTemplates
（2） 在WebGLTemplates檔案夾下創建子檔案夾MyTemplate，這個檔案夾保存我們自定義的模板的內容，檔案夾名可以隨意
（3） 然后在MyTemplate檔案夾創建一個index.html檔案，這時就可以在File->Build Settings->Player Settings->Resolution and Presentation看到我們自定義的模板了
（4） 根據官方檔案，編輯index.html檔案
其實更方便的是，我們可以直接把第一種方法里的default檔案夾里的內容直接復制到這里來，然后按照第一種方法去修改，最后在發布的時候選擇這個模板就可以了，
三、WebGL與網路端通信
關于WebGL與網路端互傳資料的方式 可參考此博客：https://blog.csdn.net/york_new/article/details/78984678
以下是我修改后的html檔案，可做參考：
<!DOCTYPE html>
<html lang="en-us">
<head>
<meta charset="utf-8">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Unity WebGL Player | Test</title>
<link rel="shortcut icon" href="TemplateData/favicon.ico">
<link rel="stylesheet" href="TemplateData/style.css">
<script src="TemplateData/UnityProgress.js"></script>
<script src="Build/UnityLoader.js"></script>
<script>
var unityInstance = UnityLoader.instantiate("unityContainer", "Build/WebGl.json", { onProgress: UnityProgress });
</script>
</head>
<body>
<div class="webgl-content" style="width: 100%;">
<div id="unityContainer" style="width:100%"></div>
</div>
//---------------------打包后手動增加部分
<script>
window.addEventListener('message', (e) => {
console.log(unityInstance);
// A3 緊急
// A4 氣體
// A5 恢復
let { type } = e.data;
console.log(type, 'type');
if (type === 'dispatchSize') {
const { width, height } = e.data;
const dom = document.querySelector('#unityContainer');
dom.style.height = height + 'px';
} else if (type === 'A3') {
console.log('監聽到緊急事件')
unityInstance.SendMessage('Camera', 'TestMethod', 'true');
} else if (type === 'A5') {
unityInstance.SendMessage('Camera', 'TestMethod', 'false');
console.log('監聽到恢復事件')
}
}, false);
</script>
//---------------------打包后手動增加部分
</body>
</html>
四、如何在本地運行html
想要直接運行看效果，我所知道的有以下幾種方法：
1、打包時選擇Build And Run，打包結束時會自動打開網頁運行此專案，
2、安裝火狐游覽器，雙擊打包生成的html檔案運行專案，
3、正常都是放到服務器上運行，
4、下載一個netbox2，架設一個本地服務器，
關于 此方法可參考此博客：https://blog.csdn.net/blastblade/article/details/81170020
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/226235.html
標籤：其他