たった数行でGoogle Chrome 14にしか対応していないWebSocketページをFirefox 7に対応させるJavaScript

Tweet

前、別の書き方で書いたけれども、今回はより互換性がある形で。

    <script type="text/javascript">
    // WebSocketの書き方の違いを吸収するオブジェクト
    if (typeof WebSocket == 'undefined' ) {
      if (typeof MozWebSocket != 'undefined' ) {
        WebSocket = MozWebSocket;
      }
    }
    </script>

• WebSocketオブジェクトがある場合は、何もしません。
• WebSocketオブジェクトがなく、MozWebSocketオブジェクトが場合は、WebSocketオブジェクトを作り、MozWebSocketオブジェクトと同じにします。
• WebSocketオブジェクトがなく、MozWebSocketオブジェクトもないは、何もしません。

これによって、Firefoxなど、MozWebSocketオブジェクトがあるがWebSocketオブジェクトがないブラウザでも、いつも通り var ws = new WebSocket('ws://example.com/ws'); でWebSocketが使えるようになります。

また、Firefox 7は、Google Chrome 14と同じ、WebSocketプロトコルがdraft hybi-10となっているので、Google ChromeでWebSocket接続ができるサーバであれば、Firefox 7でも接続できる可能性が高いです。

WebSocketオブジェクトについては、

• そもそもWebSocketオブジェクトがない（IE 8）
• WebSocketオブジェクトがないがMozWebSocketオブジェクトがある（Firefox 7や8）
• WebSocketオブジェクトがある（設定いじったOpera11、Safari）

というパターンわけがされて、

WebSocket接続については、

• そもそもWebSocketで接続できない（IE 8）
• WebSocketオブジェクトで接続を試みて成功（サーバとプロトコルが合致）
• WebSocketオブジェクトで接続を試みて失敗（サーバとプロトコルが不整合）

というパターンわけがされます。

特に、「WebSocketオブジェクトで接続を試みて失敗」するパターンでは、オブジェクトをnew出来るけれども、ws.onopenを経由せずにws.oncloseがコールバックされる、という流れになります。

ws.oncloseは、タイムアウトや、回線断でも呼ばれますので、ユーザーに対して、どのような理由で接続できなかったかを提示できるよう、処理には充分注意する必要があります。

2011.11.11 14:24 投稿　大野 義貴 [Web] | 固定リンク |