はじめに
たくさんの方が書いてると思いますが，自分の知識をまとめたいので，つらつらと書いていきます...
双方向通信とは
双方向通信とは，単方向通信の対義語で，送信&受信が可能な通信の事です
全二重通信と半二重通信の2種類があります
- 全二重通信：送信と受信を同時に行える通信
- 半二重通信：送信と受信を同時に行えない通信
全二重通信は半二重通信の上位互換になるのかなというイメージです
Socket.ioとは
まず，WebSocketについて
リアルタイムWeb技術の一種であり，双方向通信を可能とするプロトコルになります
Socket.ioとは，WebSocketを使用可能なNode.jsのライブラリの一種になります
実際に双方向通信を実装して，体験してみようと思います
ソースコードはここのサイトをみて作成しました．
今回，Node，Raspberrypi 3 Model B(サーバの代わり)を使用しました
RaspberrypiにNodeはOSインストール時にインストールされていると思います
各バージョンを以下にまとめます．
* OS：Raspbian GNU/Linux 9.11 (stretch)
* Node：v13.9.0
* npm：6.13.7
* Socket.io：2.3.0
サーバにするディレクトリに移動して，ディレクトリを作成し，その中に移動します
mkdir Socket_io_sample(ディレクトリ名)
cd Socket_io_sample(ディレクトリ名)
Nodeのライブラリをnpmコマンドでインストールします
node install socket.io
今回は以下の2つのファイルを作成します
- socket.js
- index.html
ファイルの位置は以下のようになります
Socket_io_sample(ディレクトリ名)
|ー package-lock.json
|ー node_modules
|ー index.html
┗ー socket.js
各ファイルに以下のソースコードを記述します
index.html
<!DOCTYPE html><!-- 言語は日本語を指定--><htmllang="ja"><head><!-- 文字コードはUTF-8を使用--><metacharset="utf-8"><!--タイトルを入力--><title>Websoketを使用したチャット</title><!--おまじないの一種です----------------------------------------------------------------><script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script><script type="text/javascript"src="/socket.io/socket.io.js"></script><!-------------------------------------------------------------------------------------></head><body><divclass="container"><!--見出しを入力する--><h1>Websocketを使用したチャット</h1><formclass="form-message"><divclass="form-group"><labelfor="message-form">メッセージ:</label><!--テキスト入力ボックスを設置する--><inputtype="text"class="form-control"id="message-form"></div><!--送信ボタンを設置--><buttontype="submit">メッセージを送信</button></form><!--入力ログが以下にに出力される--><divid="chatlogs"></div></div><script type="text/javascript">//サーバと接続(connect)するvarsocket=io.connect();//サーバからクライアントへのアクセスがあった際，dataを表示するsocket.on("server_to_client",function(data){appendMsg(data.value)});//textを表示する関数(function)を作成functionappendMsg(text){//idがチャットログの箇所に"<div>+text+</div>"を追加する
$("#chatlogs").append("<div>"+text+"</div>");}$("form").submit(function(err){//messageにmessage-formの値を保存するvarmessage=$("#message-form").val();//message-formの値を空にする$("#message-form").val('');//全てのブラウザにmessageを表示する?socket.emit("client_to_server",{value:message});//イベントが終わらない場合，強制終了させる?err.preventDefault();});</script></body></html>socket.js
varhttp=require('http');varsocketio=require('socket.io');varfs=require('fs');//サーバを建てる(ポートは3000番)varserver=http.createServer(function(req,res){//ヘッダー，コンテンツのタイプを入力res.writeHead(200,{'Content-Type':'text/html'});//index.htmlを読み込み表示し，レスポンス(res)を終了するres.end(fs.readFileSync(__dirname+'/index.html','utf-8'));}).listen(3000);//サーバでsocket.io(双方向通信)を可能にする?vario=socketio.listen(server);//サーバとクライアントの接続が起きた際の処理を記述io.sockets.on('connection',function(socket){//クライアント(ブラウザ)からサーバへの通信が行われた際の処理を記述socket.on('client_to_server',function(data){//サーバからクライアントへの通信が行われた際の処理を記述//data.value:入力した文字列?を各クライアントに分け与える(emitする)io.sockets.emit('server_to_client',{value:data.value});});});これにて双方向通信を体験できるのかなと思います．