Socket.IO-Hello World

*app.js* というファイルを作成し、次のコードを入力してエクスプレスアプリケーションをセットアップします-

var app = require('express')();
var http = require('http').Server(app);

app.get('/', function(req, res) {
   res.sendfile('indexl');
});

http.listen(3000, function() {
   console.log('listening on *:3000');
});

私たちはサービスするために indexl ファイルを必要とし、indexlと呼ばれる新しいファイルを作成し、それに次のコードを入力します-

<!DOCTYPE html>
<html>
   <head>
      <title>Hello world</title>
   </head>
   <body>Hello world</body>
</html>

これが機能するかどうかをテストするには、ターミナルに移動し、次のコマンドを使用してこのアプリを実行します-

nodemon app.js

これにより、localhost：3000でサーバーが実行されます。ブラウザに移動し、localhost：3000と入力してこれを確認します。

これでエクスプレスアプリケーションが設定され、ルートルートでHTMLファイルが提供されるようになりました。これで、Socket.IOが必要になり、ユーザーがこのページにアクセスするたび、および誰かがこのページに移動する/閉じるたびに「ユーザーが切断されました」と「接続されたユーザー」を記録します。

var app = require('express')();
var http = require('http').Server(app);
var io = require('socket.io')(http);

app.get('/', function(req, res) {
   res.sendfile('indexl');
});

//Whenever someone connects this gets executed
io.on('connection', function(socket) {
   console.log('A user connected');

  //Whenever someone disconnects this piece of code executed
   socket.on('disconnect', function () {
      console.log('A user disconnected');
   });
});

http.listen(3000, function() {
   console.log('listening on *:3000');
});

require（ 'socket.io'）（http）は、httpサーバーに接続された新しいsocket.ioインスタンスを作成します。 * io.onイベントハンドラー*は、ソケットオブジェクトを使用して、接続、切断などのイベントを処理します。

接続と切断に関するメッセージを記録するようにサーバーを設定しました。クライアントが必要に応じて接続を確立できるように、ここでクライアントスクリプトを含めてソケットオブジェクトを初期化する必要があります。スクリプトは、* '/socket.io/socket.io.js'にある ioサーバー*によって提供されます。

上記の手順を完了すると、indexlファイルは次のようになります-

<!DOCTYPE html>
<html>
   <head>
      <title>Hello world</title>
   </head>
   <script src = "/socket.io/socket.io.js"></script>

   <script>
      var socket = io();
   </script>
   <body>Hello world</body>
</html>

localhost：3000にアクセスすると（サーバーが実行されていることを確認してください）、ブラウザーに Hello World と表示されます。サーバーコンソールのログを確認してください。次のメッセージが表示されます-

A user connected

ブラウザを更新すると、ソケット接続が切断され、再作成されます。あなたは、コンソールログで次を見ることができます-

A user connected
A user disconnected
A user connected

ソケット接続が機能するようになりました。これは、Socket.IOで接続を簡単にセットアップできることです。

Socket.io-hello-world

Socket.IO-Hello World