给Unity3D WebGL添加下载与上传

最近基于unity webgl 制作了一个绘图板，其中涉及到读写本地资源，并且处理完成数据后要完成下载操作。

其中既包含了上传也包含下载。即使都是本地的文件操作，但由于浏览器的沙盒设计，我们并不能直接通过IO类进行文件操作，必须通过与js的通信，进行数据交换。

本篇将说明如何将两者数据进行交换，并提供相应的验证过的代码，你可以直接修改并使用下面代码。 理论上来说，这个代码是可以修改为下载其他任意文件的，比如下载贴图这里传的是内存指针，所以不限于下载图片。上传的代码也类似，给unity发送的是一个url，也是替换为任意类型都可以的。

有一点比较值得注意，在WebGL的开发过程中，每次重新部署后进入浏览器页面测试，都需要手动请清理缓存。 否则会出现部分文件被缓存，测试不正确情况。

文件下载

下面是个js封装库，并且实现了对图片文件的下载与上传。

文件上传

当然这里也有一些值得注意的东西：

传入的参数有类型限制

string, a number 就这俩，之前我一度尝试使用byte[]，或者从js发送内存指针都提示参数类型不正确。 下面是文档摘录。 Where objectName is the name of an object in your scene; methodName is the name of a method in the script, currently attached to that object; value can be a string, a number, or can be empty. For example:

在input很容易获取浏览器的缓存文件，通过URL.createObjectURL() 方法，创建一个表示参数中给定文件对象或 Blob 对象的 URL。这个方法返回的是一个 DOMString，它包含了一个唯一的 URL，这个 URL 指向由参数指定的文件对象或 Blob 对象，最后通过WebRequest加载这个URL就可以达到我们的目的。

这里使用了async语法，注意如果你改动这部分报错了，大概不会提示出来，会很难查bug哦。哈哈

需要获取运行实例

下面摘录自官方文档，大致意思是js要调用unity的逻辑需要找到对应已创建的实例。

However, if you are planning to call the internalJavaScriptfunctions from the globalscopeof the embedding page, youshouldalways assume that there aremultiplebuildsembedded on the page, so youshouldexplicitly specify whichbuildyou are referencing to. For example, if your game hasbeeninstantiatedas:
var gameInstance = UnityLoader.instantiate("gameContainer","Build/build.json", {onProgress: UnityProgress});
Then you can send a message to thebuildusing gameInstance.SendMessage(),oraccess thebuildModule o

下面代码是生成后的index.html，我们直接将unity的实例保存到当前window中

window.unityInstance = unityInstance;

方便全局调用。

参考官方文档链接：

https://docs.unity3d.com/2017.3/Documentation/Manual/webgl-interactingwithbrowserscripting.html

以上，给Unity3D WebGL添加下载与上传的记录，另外如果你想要找代码，可以直接点击阅读原文转跳到我的站点。