HTML5のServer-Sent Events（SSE）に相当する機能はMicrosoftのブラウザで使える？代替手段を解説

HTML5 Server-Sent Events（SSE）をレガシーなMicrosoftブラウザで実現するには

HTML5のServer-Sent Events（サーバー送信イベント、SSE）は、サーバーからクライアントへ一方向のリアルタイム通知を行うための便利な仕組みです。しかし、Internet Explorer 10や11のようにEventSource APIをサポートしていないMicrosoft製のブラウザでは、そのまま利用できません。
ここでは、こうした環境でもSSEと同等の機能を実現するための、2つの代表的なアプローチを紹介します。

方法1：ポリフィル（Polyfill）を利用する

最も手軽な方法は、EventSourceのポリフィルを導入することです。ポリフィルを使えば、IE10およびIE11でもServer-Sent Eventsとほぼ同じ挙動を再現できます。

ポリフィルの仕組みはシンプルで、処理の冒頭で次のような判定を行います。

if ("EventSource" in global) return;

このコードにより、すでにEventSourceをネイティブサポートしているモダンブラウザでは何も実行されず、未対応のブラウザでのみポリフィルが動作するよう設計されています。

実際の実装方法については、GitHub上で公開されているEventSourceポリフィルのリポジトリを参照するとよいでしょう。導入手順やサンプルコードが詳しく解説されています。

方法2：WebSocketを利用する

もうひとつの選択肢がWebSocketです。WebSocketもIE10およびIE11で動作し、さらに双方向通信をサポートしている点が大きな特徴です。

SSEがサーバーからクライアントへの一方向通信であるのに対し、WebSocketではクライアントとサーバーの両方向でリアルタイムなデータ送受信が可能です。チャットアプリケーションや、双方向のやり取りが必要なシステムでは、WebSocketの方が適しています。

まとめ

IE10／IE11などのレガシーなMicrosoftブラウザでServer-Sent Events相当の機能を実現したい場合は、「ポリフィル」か「WebSocket」のどちらかを選ぶことになります。一方向の通知だけで足りるならポリフィル、双方向通信が必要ならWebSocketと、要件に応じて使い分けるのがおすすめです。