現在、頻繁に使用されるほとんどの人気のあるサイトでは、リアルタイムの更新が一般的です。
- スタック交換
- フェイスブック
- ツイッター
これらの「リアルタイム更新」はどのように機能するのでしょうか? 一般的な鳥瞰図を探しているだけです。JS が更新のために X 秒ごとにサーバーを呼び出して、それを<ul>
. サーバーから送信された通知は、より多くのコンテンツをプルするために使用されましたか?
デモでこれを説明する簡単なハウツー記事があれば素晴らしいでしょうか?
現在、頻繁に使用されるほとんどの人気のあるサイトでは、リアルタイムの更新が一般的です。
これらの「リアルタイム更新」はどのように機能するのでしょうか? 一般的な鳥瞰図を探しているだけです。JS が更新のために X 秒ごとにサーバーを呼び出して、それを<ul>
. サーバーから送信された通知は、より多くのコンテンツをプルするために使用されましたか?
デモでこれを説明する簡単なハウツー記事があれば素晴らしいでしょうか?
スタック オーバーフローは、リアルタイムの更新にWeb ソケットを使用しています。ソース コード (2012 ソース コード) を見ると、次のように表示されます。
StackExchange.ready(function () {
StackExchange.realtime.init('ws://sockets.ny.stackexchange.com');
StackExchange.realtime.subscribeToInboxNotifications();
StackExchange.realtime.subscribeToReputationNotifications('1');
});
ただし、一部の Opera バージョンは WebSocket をサポートしていないことに注意してください。( Opera 10.70 まで)
ただし、Facebook は Web Sockets を使用していないようで、サーバーが新しい情報があるまで接続を保持し、リクエストに応答するロング ポーリングと呼ばれる手法で単純な XHR を使用しているだけだと思います。開発者ツールを開くと、ステータスが保留中のリクエストが常に 1 つあることがわかります。
確かに、〜60秒ごとにリクエストを送信しています。
Twitter も「リアルタイム更新」に単純な XHR (1 分間隔) を使用しているようです。
Facebookはを使用していますlong polling/Comet
。そのため、接続を確立して応答を待ち、応答がない場合はタイムアウトして再試行します。タイムアウトは約 40 秒です。これが、ほとんどの即時更新を行う方法です。しかし、彼らは技術の組み合わせを使用します。ロング ポーリングの詳細については、こちらを参照してください。