NodeJs搭建简单UnityWebGL web服务器2018-06-16

前言:

端午节放假恰好有时间研究下Unity3D 在Web端的实现。
基本上都比较顺利,使用的是Unity如下版本:2018.1.4f1


NodeJs搭建简单UnityWebGL web服务器2018-06-16_第1张图片

也导出了WebGL 游戏版本,放在一个文件夹中,如图:



但这个时候,问题来了,怎么跑起来这个WebGL版本的游戏呢? 直接尝试拖拽index到浏览器,但提示:


NodeJs搭建简单UnityWebGL web服务器2018-06-16_第2张图片

很崩溃,这时候,我搜了一堆如何解决浏览器支持webGL的方式,但拖拽进去的都是这样。
但由于个人还是希望看看手机上效果如何,没准手机浏览器支持,于是还是想搭建个正规的服务器,让这个web页面跑起来。

惊喜来了,使用网址浏览后,浏览器就莫名其妙支持了,无论是哪个游览器,很惊喜。(略会nodejs web前后端开发,这里是存在跨域访问的问题,所以最好还是点击 build and run,或者搭个web服务器 访问)。于是我一定要把这个过程记录下来,方便给一直从事客户端游戏开发的小伙伴看下。其实不是webGL的游戏没跑通,也许就是web服务没搭好。(当然网上也有不少这样的提醒了)

下面就是简单使用Nodejs及express搭建服务器的过程。(当然使用nginx或者tomcat 都行的 我是windows本机测试,先就这么搭吧)

NodeJs创建Web服务器

var http = require('http');
var server = http.createServer(function(req, res) {
 res.writeHead(200, {
  'Content-Type': 'text/plain'
 });
 res.write('hello world!');
 res.end();
 }).listen(80);

这是一个原生式的创建一个web服务器的方式,但是有缺陷。如果我们想要将我们的静态页面至于与服务器同域下的时候很不方便。

Express创建Web服务器

var express = require('express');
var app = express();
var server = require('http').createServer(app);
//指定静态文件的位置
app.use('/', express.static(__dirname + '/public')); 
//监听端口号
server.listen(80);

这里我们借用Express封装好的方法创建了一个监听80端口的方法,不仅我们可以作为后端服务通过localhost:80访问,还可以访问我们的前端页面localhost:80/index.html。

这样页面与服务端交互也方便很多了。

总之跑起来的大概是酱紫,不管咋说,蛮开心的。


NodeJs搭建简单UnityWebGL web服务器2018-06-16_第3张图片

NodeJs搭建简单UnityWebGL web服务器2018-06-16_第4张图片

NodeJs搭建简单UnityWebGL web服务器2018-06-16_第5张图片

你可能感兴趣的:(NodeJs搭建简单UnityWebGL web服务器2018-06-16)