この記事では、Node.js で webSocket 接続を作成する手順を説明します。
Node.js で WebSocket 接続を作成するには?
WebSocket 接続は、クライアント側とサーバー側の開発の 2 つの部分で構成されます。双方の間の仲介として機能するダミー Web サイトも作成する必要があります。これを使用すると、メッセージが両側から転送されます。 NodeJs で WebSocket を作成するには、以下の手順を参照してください。
ステップ 1: NodeJs 環境のセットアップ
「」の助けを借りて CD ” コマンドを実行し、プロジェクト フォルダー内を移動し、その中でコマンドを実行します。 npm init -y ” を実行してデフォルトの NodeJs モジュールをインストールします。
npm初期化 - そして
上記のコマンドを実行すると、「」という名前の新しいファイルが作成されます。 パッケージ.json プロジェクトに関連する基本情報を格納する「」が作成されます。
ステップ 2: WebSocket モジュールのインストール
WebSocket プロトコルを使用するには、「」という名前のモジュールを使用します。 うーん 」をNodeJsプロジェクトにインストールする必要があります。インストール用のコマンドは以下に挿入されます。
npm インストール ws
以下の出力は「 うーん 」が目的の NodeJs ディレクトリにインストールされています。
ステップ 3: WebSocket サーバーのセットアップ
WebSocket プロトコルのサーバー側をセットアップするには、新しい「 .js 「プロジェクトフォルダー内に「」という名前のファイルを入力します。 サーバ側 ” と入力し、以下のコードを挿入します。
定数 wsオブジェクト = 必要とする ( 「うーん」 ) ;定数 うーん = 新しい wsObj. サーバ ( { ポート : 3000 } ) ;
コンソール。 ログ ( 「Linuxhint サーバーが起動しました」 ) ;
上記のコードの説明は次のとおりです。
- まず、「」の助けを借りて、 必要とする() ” メソッド、” うーん 上記のセクションですでにインストールされているモジュールは、現在の「 サーバーサイド.js ' ファイル。
- 次に、「」を呼び出します。 サーバ() ” のオブジェクトを使用した” メソッド うーん 「」という名前のモジュール wsオブジェクト ” のポート番号を渡します。 3000 」を実行して、Localhost の指定したポートでサーバーを起動します。
- また、コンソール ウィンドウにランダムなメッセージを表示して、サーバーがサーバー側から起動したことを確認します。
ステップ 4: WebSocket クライアントのセットアップ
「」という名前の別のファイルを作成します。 クライアント側 」を使用して、サーバーに接続するクライアント側を設定します。以下のコードを挿入して、サーバー経由で接続したときにランダムなメッセージを表示する基本的なクライアント側を設定します。
定数 オブジェクト = 新しい ウェブソケット ( 「ws://ローカルホスト:3000」 ) ;オブジェクト addEventListener ( '開ける' 、 ( ) => {
コンソール。 ログ ( 「Linuxhint サーバーに接続されました!」 ) ;
} ) ;
上記のコード ブロックの説明は次のとおりです。
- まず、「」の新しいオブジェクトを作成します。 WebSocket() 「」というポート番号を持つローカルホストでリッスンされるプロトコル 3000 ”。
- 次に、新しいオブジェクトを「」という名前の変数に保存します。 オブジェクト ”。
- その後、「」のイベントリスナーをアタッチします。 開ける ' これとともに ' オブジェクト ”。このイベント リスナーは、指定されたポート番号でサーバーがローカルホストにロードされると、匿名関数を実行します。
- この関数は、接続関連のランダムなメッセージをコンソールに表示します。
ステップ 5: Web ページの作成
プロジェクトディレクトリ内に「 .html 「」という名前のタイプのファイル 索引 」には、HTML の基本構造と、「」をインポートするための単一の script タグが含まれています。 clientSide.js ' ファイル:
DOCTYPE html >< htmlのみ = 'で' >
< 頭 >
< メタ文字セット = 「UTF-8」 >
< タイトル > クライアント タイトル >
頭 >
< 体 >
< h1 > Linuxhint Web サイト h1 >
体 >
< スクリプトソース = 「clientSide.js」 > 脚本 >
html >
ステップ 6: 実行
「」を開きます インデックス.html ” を Web ページ上でディレクトリから直接ダウンロードしてください。次に、ターミナルまたはコマンド プロンプトに移動し、以下のコマンドを実行します。
ノードサーバー側
出力メッセージには、サーバーが起動されたことが示されます。
次に、サーバーを閉じずに、index.html に移動し、Web ブラウザーで開きます。接続成功のメッセージがコンソール ウィンドウに表示されます。
出力には、クライアント側とサーバー側の間で接続が確立されたことが示されます。このブログでは、NodeJs で webSocket 接続を作成するプロセスについて説明しました。
結論
NodeJs で webSocket 接続を作成するには、新しい NodeJs プロジェクトを作成し、「 うーん 「」モジュールを実行して「 npm インストール ws ' 指示。次に、サーバー側のファイルを作成し、その中に「 うーん 」モジュール。このモジュールを使用して、ポート「」に WebSocket サーバーを作成します。 3000 ”。クライアント側に別のファイルを作成し、そのファイルで「」の新しいオブジェクトを定義する必要があります。 ウェブソケット 「」という名前 オブジェクト ” そしてポートでリッスンさせます” 3000 ”。このブログでは、NodeJs で WebSocket 接続を確立する手順を説明しました。