WebSocketサーバー

今回JINS MEMEを使った開発を行おうと下記サイトを参考にWebSocketサーバーを立てました。
これはスマホのアプリ（Loggerアプリ）がClientとなり、立てたWebSocketサーバーに接続に行くはずなのですが、うんともすんともならなかったので調べたことについて書きます。

WebSocketサーバーのプログラムはNode.jsで作っています。
下記はNode.jsのプログラムサンプル（JINS MEMEのWebSocket連携に書かれてあるものそのまま）です。

const server = require("ws").Server;
const ws_server = new server({ port: 5000 });

ws_server.on("connection", ws => {
  console.log("connected from client");
  ws.on('message',function(message){
    if(message.indexOf("heartbeat") === -1){
      //メッセージを出力
      console.log(message);

      //実際の処理する場合はparseして処理していきます
      //const obj = JSON.parse(messeage);
    }
  });
});

今回はWebSocketサーバーはポート5000としています。
"connected from client"が出力されていないので接続できていないようでした。

まずはちゃんとWebSocketサーバーにできるかテストする

サーバーが接続できないのか、クライアント側が接続に行けてないのかどうか（サーバーの問題かクライアント側の問題か）を切り分けするため、まずはツールを使ってWebSocketサーバーに接続できるかどうか試してみます。

「WebSocket テストサイト」とかで検索をするとテスト接続できるサイトが公開されているのでどれかを選択して使えば良いです。

今回は下記のサイトを使わせていただきました。
https://develop.miugle.info/websocket/

URL（「接続」の入力欄）に「ws://localhost:ポート番号」を指定します。
localhostはローカルIPアドレスでも良いです。「あれ？外部サイトからローカルアドレス？」って思ってしまいましたが、こちらはJavaScriptでWebSocketアクセスしているのでこのサイトを開いているブラウザがローカルネットワーク上の端末である場合は大丈夫なんですね。（ページのソースを見ればJavaScriptで実装されていることがわかります）

結果は「エラー」と出ているのでサーバーに接続できない（接続できていない）ことがわかりました。

怪しいのはファイアウォール

今回はサーバーをWindowsノートPCで起動しています。
なので怪しむべきはWindowsが親切にネットワークの遮断を判断してくれているファイアウォールです。

ということでとりあえず全部いったん解除してこれが原因かどうかを特定してみましょう。

Windows Defenderの設定で「ファイアウォールの状態」を「無効」にします。
今回はローカルネットワーク内でWebSocket接続しようとしてうまくいかなかったのでプライベートネットワークの「プライベートプロファイル」の設定を無効にしてみました。

それから再度テスト接続を先ほどのサイトから行うと・・

サイト上に「接続完了」と表示され、WebSocketサーバー側でも"connected from client"と出力されました。
ということはファイアウォールが原因ということがわかりました。

ちなみにウイルス対策ソフトを入れている場合、そちらのファイアウォール機能が働いていることもあるのでいったんそれも止めてみると良いです。（ソフト自体停止できるなら一時的に停止してみるのもアリと思います）

ファイアウォールの設定をきれいにやっておく

ファイアウォールはこのままでも良いですが、ローカルネットワークで全くファイアウォールが効かないことになるので、ポート指定でできるようにしておくと良いですね。

上記のようにポート5000に対して「接続を許可」にしてあげます。
これは「新しい規則…」で設定を追加してあげることができます。

おわりに

設定は以上です。
当初行いたかったJINS MEMEのLoggerアプリからも無事WebSocketサーバーに接続できるようになりました。