web-dev-qa-db-ja.com

JavaScriptを使用したサーバーポーリング

データを非常に迅速に更新する必要があるアプリケーションのJavaScriptを使用してサーバーをポーリングするためのベストプラクティスは何ですか?フロントエンドにはjQueryを使用し、バックエンドにはJava SpringFrameworkを使用しています。

更新されたデータの例としては、非常に急速に(1秒ごとに)更新されるアイテムのリストがあります。

25
newbie

jQueryのAjax関数 を使用して、1秒ごとにサーバーをポーリングすることをお勧めします。その後、サーバーはほぼリアルタイムでブラウザーへの指示で応答できます。

上記の代わりに long polling を検討して、ポーリングの頻度を増やすことなく遅延を減らすこともできます。

引用 毎日来る:ロングポーリングテクニック

ロングポーリングコメットテクニックは、従来のポーリングを最適化してレイテンシーを削減するテクニックです。

従来のポーリングでは、XMLHttpRequestが一定の間隔でサーバーに送信されます。たとえば、15秒ごとに新しいXMLHttpRequestを開き、即時応答を受信して​​、接続を閉じます。

ロングポーリングはサーバーにリクエストを送信しますが、応答が利用可能になるまでクライアントに応答は返されません。クライアントが応答を受信したため、または要求がタイムアウトした場合に接続が閉じられるとすぐに、新しい接続が開始されます。その結果、サーバーは通常、情報を返してクライアントに返す準備ができたときに接続が確立されるため、待ち時間が大幅に短縮されます。

上記に加えて、ロングポーリング手法の詳細な説明については、次のStackOverflowの投稿に対する承認済みの回答を確認することをお勧めします。

40
Daniel Vassallo

I 2番目のダニエルの提案 ロングポールまたはプッシュを使用します。チェックアウト

CometDは、Cometと呼ばれるAjaxプッシュテクノロジーパターンを使用するスケーラブルなHTTPベースのイベントルーティングバスです。 「Comet」という用語は、Alex Russellの投稿Comet:Low Latency Data for theBrowserで造られました。

Springでそれを機能させる方法を説明するページがあります。

3
Gordon

2018年の時点で、promise構文でフェッチ関数を使用する必要があります。

<script type="text/javascript">
setInterval(function(){
  fetch("your_serverside_script.php") // Any output from the script will go to the "result" div
  .then(response => response.text())
  .catch(error => document.getElementById("result").innerHTML = error)
  .then(response => document.getElementById("result").innerHTML = response)
}, 1000); // Poll every 1000ms
</script>

<div id="result">result will appear here</div>
2
Simon Rigét