Unity ✖️Node.jsを導入してみた

katapy

2020年9月16日 12:28

「Unityに対してサーバサイドをクラウド上に作ってみたい」と思い、Node.jsとUnityを繋げてみました。

Unity側で主に使ったのはUnityWebRequestです。Unityだけの記事は結構あるのですが、サーバと合わせて書いてあるのは見当たらない感じがしたので、両サイドを書いていきます。

Node.js、javascriptは今回初めて触った超初心者なので、お手柔らかにお願いしますm(_ _)m

環境

Unity側

macOS Catalina 10.15.6

Unity 2018.4.19.f1

サーバ側

Linux (ubuntu 18.04)

node.js version v10.22.0

npm version 6.14.6

サーバサイドの補足

サーバOSは以下の記事を参考にAzureで建てました。

注意する点は、パブリック受信ポートでsshだけでなく、http、httpsも開く点です。既存のVMでhttpが開いていないと、ローカルでしか動かない(つまり、サーバとして機能しない)ことになっちゃいます。

また、使用するport(今回は3001)を開くことも忘れないでください。Azureの場合、ネットワーク→受信ポートの規則を追加するボタンを押せば設定できます。

Unity側の設定

Unity側はいろんな記事があるので軽く流します。参考にさせてもらったのは以下の記事のUnityからHTTPにPOST接続する方法の部分です。

ほぼ一緒のコードではありますが、僕が使ったコードも載せておきます。

<SendDataToServer.cs>

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.Networking;
using UnityEngine.UI;
public class SendDataToServer : MonoBehaviour
{
   public string iPAdress;
   public string port;
   public Button sendButtnn;
   // Start is called before the first frame update
   void Start()
   {
       sendButtnn.onClick.AddListener(onClickSendButton);
   }
   private void onClickSendButton()
   {
       string URL = "http://";
       URL += iPAdress;
       URL += ":";
       URL += port;
       URL += @"/";
       Debug.Log("Server URL = " + URL);
       StartCoroutine("OnSend", URL);
   }
   //コルーチン
   IEnumerator OnSend(string url)
   {
       //POSTする情報
       WWWForm form = new WWWForm();
       form.AddField("name", "taro");
       form.AddField("ID", 77);
       //URLをPOSTで用意
       UnityWebRequest webRequest = UnityWebRequest.Post(url, form);
       //UnityWebRequestにバッファをセット
       webRequest.downloadHandler = new DownloadHandlerBuffer();
       //URLに接続して結果が戻ってくるまで待機
       yield return webRequest.SendWebRequest();
       //エラーが出ていないかチェック
       if (webRequest.isNetworkError)
       {
           //通信失敗
           Debug.Log(webRequest.error);
       }
       else
       {
           //通信成功
           Debug.Log(webRequest.downloadHandler.text);
       }
   }
}

このスクリプトをgameobjectにアタッチし、ボタンをドロップします。

またアタッチしたgameobjectにサーバ0SのIPアドレスとportを入力します。

次に、サーバ側を作って行きます。

サーバ側

サーバサイドのコマンドに移動し、ファイルを置くフォルダまで移動します。(コマンドは移動:cd、フォルダ作成:mkdirです)

移動したら、nano 等のテキストエディタを開くコマンドを叩きます。

<コマンドの例>

mkdir nodejs
cd mkdir
nano

テキストエディタを開いたら、以下のjsコードを書き(またはコピペし)ます。

<server.js>

const http = require('http');
const PORT = 3001;
http.createServer(function(req, res) {
 if(req.method === 'GET') {
   console.log('Hello World\n');
 } else if(req.method === 'POST') {
   var datas = '';
   var dataList = [];


  //POSTデータを受けとる
  req.on('data', function(chunk) {datas += chunk})
     .on('end', function() {
       dataList = datas.split('&')
       res.writeHead(200, {'Content-Type': 'text/plain'});
       res.end('Succeded to receive ' + datas);
       dataList.forEach(function( data ) {
          console.log( data );
          });
     })
  }
}).listen(PORT);
console.log(`Server running. Port is ${PORT}`);

書き終わったら、

control+x → Y → ファイル名(server.js)を入力 → Enter

で元のコマンドに戻ると思います。

javascriptのコードについては、以下の記事を参考にしました。

最後に、以下のコマンドでserver.jsを起動します。

sudo node server.js

結果

Unityの再生ボタンを押し、ドロップしたボタンをクリックして動作確認してみましょう。

Unity側

以下のログが出たら成功です。

Succeded to receive name=taro&ID=77

サーバ側

以下のログが出たら成功です。データがうまく送信できているのがわかります。

Server running. Port is 3001
name=taro
ID=77

Unity ✖️Node.jsを導入してみた

環境

Unity側の設定

サーバ側

結果

いいなと思ったら応援しよう！