ajaxとwebsocketの違いとwebsocketの一般的な使い方の紹介

筆者は最近、会社のプロジェクトで高級なビジネスロジック処理に触れてきたが、興味深い点はフロントエンドがバックグラウンドから与えられたプッシュを受けることだ.
一般的にフロントエンドとバックエンドのインタラクションは主にajaxを使用して非同期操作呼び出しインタラクションを行いますが、興味深いことに、このインタラクション方式は一般的に単一のインタラクションです.
−フロントエンドがバックエンドに要求バックエンド受信要求を発行した後に実行し、フロントエンドがバックエンドから与えられた戻り値を受け入れることができても、バックエンドと対話するアクティブ権は常にフロントエンドハンドの中に置かれる.
2つの興味深い問題に直面します
1.フロントエンドで呼び出されたインタフェースのバックエンド操作イベントが長すぎると、戻り操作の応答時間が長すぎる可能性があります.ユーザーが他のページをクリックすると、戻り操作が正常に解決されません.
2.バックエンドに何か重要な問題があったら、フロントエンドメッセージをプッシュする必要があります.このとき、フロントエンドは受信できません.
この2つの問題に直面する主流の解決策は、1つ目のページ全体にロードされたアニメーションを作成し、ページ全体をロックして、バックエンド全体の戻り値が終了してからページをロック解除するようにユーザーに強制することです.
2つ目は、今日お話ししたwebsocketという概念を導入します.
一.Websocketとは
Websocketプロトコルは2008年に誕生し、2011年に国際標準となった.すべてのブラウザがサポートされています.
その最大の特徴は、サーバーが自発的にクライアントに情報をプッシュすることができ、クライアントも自発的にサーバーに情報を送信することができ、本当の双方向平等な対話であり、サーバープッシュ技術の一種に属する.
従来のajaxとの最大の違いは、双方向に受け入れ、送信できることです.
一.Websocketの簡単な使用
私たちのフロントエンドにとってwebsocketの使用方法は非常に簡単で、プロトコル識別子はws(暗号化されている場合はwss)、サーバーのウェブサイトはURLです.私たちは自分でwsサービスを定義するだけでいいです.
コードは次のとおりです.

var ws = new WebSocket("URL  ");
ws.onopen = function(evt) { 
 console.log("    "); 
 ws.send("Hello WORD!");
};
ws.onmessage = function(evt) {
 console.log( "Received Message: " + evt.data);
 ws.close();
};
ws.onclose = function(evt) {
 console.log("    ");
};  

上記のコードに示すように、WSという簡単な名前のwebsocketサービスを作成し、バックグラウンドで定義したいパスにhello wordのメッセージを送信し、プッシュを受信したときにReceived Messageを印刷することに成功しました.
あなたのwsサービスが開いた後、フロントエンドの内でずっと保留状態になります.フレームワークが横行しているため、フレームワークやフロントエンドプロジェクトがnodeコンパイルまたは実行されたとき、wsサービスをすべてのページのテンプレートに書くことで、プロジェクトを開いた状態でずっと実行することができます.
このとき、プッシュメッセージを受け入れるように書く必要があります.バックエンドがプッシュメッセージのタイプを判断し、対応する操作を行うには、ajax非同期操作が戻り値を待つ必要はありません.あるいは、戻り値を待ってから自分で操作する時間が長すぎて、ユーザーを長く待たせる悩みは全く必要ありません.この技術は今でも一般的に使われています
オンラインチャットルームとプッシュメッセージを受け取る必要がある場所.
しかし、一般的に推送量が大きいと、会社は大きなクラウドサービスを選びます.例えば、筆者の会社はクラウドサービスを利用しています.暇があれば、一度穴を開けてクラウドサービスのチュートリアルを話します.
まとめ
以上、ajaxとwebsocketの違いやwebsocketの使い方を紹介しました.