Unity3D发布WebGL(网页)到IIS服务器并加入ASP.NET页面中

在Unity3D中发布WebGL,当我们需要将其加入我们自己的网站时,需要将WebGL的内容放入服务代码中。
1. 首先我们需要创建IIS服务器。
打开控制面板->程序->启用或关闭Windows功能->启用IIS服务。
启用IIS服务
这里我们将所有的IIS服务都勾选,在后续使用中都有可能会用到。
2. 接下来我们创建ASP.NET网站
在VS中创建ASP.NET的Web应用程序
创建ASP.NET Web应用程序
其他设置可依据自身需要进行选择。
完成ASP.NET Web应用程序创建后,找到项目目录,将打包导出的WebGL文件复制到指定目录中。
在VS中的解决方案资源管理器中选择显示所有文件,右击我们新导入的WebGL文件并选择包含在项目中。
将WebGL包含在项目中

接下来在网页中根据需要制定相应的跳转或单独初始化WebGL内容。初始化需要调用如下代码:

<script src="TemplateData/UnityProgress.js"></script>
<script src="Build/UnityLoader.js"></script>
<script>
    var gameInstance = UnityLoader.instantiate("gameContainer", "Build/test.json", {onProgress: UnityProgress});//UnityProgress可自定义,详情可参看Unity官方文档
</script>

自定义WebGL模板
需要在ASP.NET中设置Web.config文件,在其中添加mimeMap属性。

<mimeMap fileExtension=".unity3d" mimeType="application/unity"/>
<mimeMap fileExtension=".unityweb" mimeType="application/unity"/>

设置MimeMap属性
然后点击重新生成即可完成网页操作。
3. 发布ASP到指定文件夹
右击项目,选择发布。
发布网站
在弹出来的页面中选择新建配置,发布到文件夹中。
选择指定的发布目标
在IIS、FTP的设置中选择文件系统,并制定发布的位置,最后点击发布按钮即可发布网站到本地。
4. 接下来我们需要将刚刚发布到本地的网站加入到IIS服务中
打开控制面板->系统和安全->管理工具->Internet Information Services (IIS)管理器。
右击网站,添加网站即可进入设置界面。
在IIS中添加网站
在设置界面中,填写网站名称,选择刚刚发布的网站目录,并分配本地IP地址。
设置网站属性
设置完成后即可通过浏览器访问我们发布的网站。
在局域网中可以通过IP地址进行访问。
PS:Unity官方提示WebGL不能在移动端运行,但是在发布的网页中,如果WebGL设置的内存不大,也可以在手机上打开(只测试了Chrome)。
如果出现错误提示,如无法解析UnityLoader.js等问题,需要在IIS服务器中添加MimeMap设置,添加对.unity3d和.unityweb文件类型的支持即可。
添加MimeMap设置
添加类型配置

Unity 外部加载音乐通常是在游戏运行时从文件系统、网络或其他外部资源动态加载音频内容,而不是在项目构建阶段就包含所有音乐文件。这样做可以节省存储空间,并且方便管理大量的音效和背景音乐。 如果你要在 WebGL发布 Unity 游戏到阿里云服务器,首先你需要将项目导出为 HTML5 或 WebGL 版本。这通常需要安装 UnityWebGL 编译器插件并配置好 Build Settings。以下是基本步骤: 1. 准备工作: - 确保你的 Unity 版本支持 WebGL 导出。 - 使用 Unity 内置的 Build Pipeline 或第三方工具如Aseprite等处理图片和音频资源。 2. 导出设置: - 打开 Project Settings > Publishing Settings,选择 WebGL 作为发布平台。 - 配置 Export Path,指定保存导出文件的位置。 - 对于音频,确保它们被添加到了 Resources 文件夹,并且是 .ogg 或 .mp3 格式(因为 Web 环境下推荐使用这两种格式)。 3. 动态加载音频: - 在 JavaScript (通常在`game.js`或类似脚本),你可以使用 `XMLHttpRequest` 或 Fetch API 来异步加载音频资源,比如: ```javascript var xhr = new XMLHttpRequest(); xhr.open('GET', 'path/to/audio.mp3', true); xhr.responseType = 'arraybuffer'; xhr.onload = function() { audioContext.decodeAudioData(xhr.response, function(buffer) { audioSource.buffer = buffer; sourceNode.connect(audioContext.destination); }); }; xhr.send(); ``` 4. 部署到阿里云: - 将导出的游戏文件上传至阿里云的OSS存储服务。 - 创建一个指向游戏文件的URL,然后在HTML引用它,例如 `<a href="http://yourbucket.aliyuncs.com/game.html">Play Game</a>`。
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值