node.jsでサーバサイドのJavaScrpt開発：socket.ioはwscatではなくiocatでデバッグ

久しぶりにsocket.ioを使うので、簡単なプログラムを作ってテストをしてみることにしました。サーバサイドはこれ。

/// <reference path="./typings/main.d.ts" />

var fs = require("fs");
var server = require("http").createServer(function(req, res) {
     res.writeHead(200, {"Content-Type":"text/html"});
     var output = fs.readFileSync("./index.html", "utf-8");
     res.end(output);
}).listen(8080);
var io = require("socket.io").listen(server);

var reply:string;

io.sockets.on("connection", (socket) => {

  io.sockets.emit("message", "thank you for connecting");

  console.log("connection from socket.io client");

  socket.on("message", (message) => {
    console.log("key:message %s", message);
    reply= "I got message from you:" + message;
    io.sockets.emit("message", reply);
  });

  socket.on("disconnect", () => {
    console.log("disconnected");
  });

  socket.on("CS_REQ_registerdRiders", () => {
    io.sockets.emit("SC_RES_registeredRiders", JSON.stringify(registeredRiders));
    console.log("CS_REQ_registerdRiders:response send");
  });

});

/// <reference path="./typings/main.d.ts" />

var fs = require("fs");

var server = require("http").createServer(function(req, res) {

res.writeHead(200, {"Content-Type":"text/html"});

var output = fs.readFileSync("./index.html", "utf-8");

res.end(output);

}).listen(8080);

var io = require("socket.io").listen(server);

var reply:string;

io.sockets.on("connection", (socket) => {

io.sockets.emit("message", "thank you for connecting");

console.log("connection from socket.io client");

socket.on("message", (message) => {

console.log("key:message %s", message);

reply= "I got message from you:" + message;

io.sockets.emit("message", reply);

});

socket.on("disconnect", () => {

console.log("disconnected");

});

socket.on("CS_REQ_registerdRiders", () => {

io.sockets.emit("SC_RES_registeredRiders", JSON.stringify(registeredRiders));

console.log("CS_REQ_registerdRiders:response send");

});

クライアント側はこんな感じ。

<html>
<head>
  <meta charset="UTF-8">
  <title>socket.io test</title>
</head>
<body>
  <input type="text" id="msg_input"/>
  <button onclick="sendMessage();">send socket.io message</button>
  <script src="/socket.io/socket.io.js"></script>
  <script type="text/javascript">
    var socketio = io.connect('http://raspberrypi.local:8080');
    function sendMessage() {
      var textInput = document.getElementById('msg_input');
      var msg = textInput.value;
      socketio.emit("message", msg);
      textInput.value = '';
    }
  </script>
</body>
</html>

<html>

<head>

<title>socket.io test</title>

</head>

<body>

<button onclick="sendMessage();">send socket.io message</button>

var socketio = io.connect('http://raspberrypi.local:8080');

function sendMessage() {

var textInput = document.getElementById('msg_input');

var msg = textInput.value;

socketio.emit("message", msg);

textInput.value = '';

}

</script>

</body>

</html>

ただブラウザでテストするのはどうにもまどろっこしいので、コマンドラインから実行できるよう、ネット上で多く紹介されているwscatを使うことにしました。最初にハマったのは、wscatがwsに同梱されているのでは無く、wscatとして配布されていること。今のwsのレポジトリではwscatは実行できないようです。パスの問題でしょうか。

で次にハマったのが、wscatでいくらnodeに接続しても接続が確立されずにhang upとなったり、無言となったりするという現象。いろいろ試してみた挙げ句、wscatではなくiocatを使うと接続に成功しました。

iocat

socket.ioはメッセージ送信時にキーを付ける機能があったりしますので、そのあたりが通常のwebsocketとは互換性が無いのかもしれません。