34

私のスクリプトの1つに、次のコードがあります。

var webSocket = window.WebSocket || window.MozWebSocket;
window.ws = new webSocket('ws://64.121.210.140:2585/consoleappsample', 'my-protocol');

これはうまくいきます。ただし、ユーザーがページを変更すると、接続を再確立する必要があります。クライアントがサーバーにデータを送信してからページを変更すると、データが受信されず、競合状態が発生する可能性があるため、これがコードに問題を引き起こしていると思います。

グローバルスコープに入れようとしましたwindow.wsが、問題は解決していないようです。接続を常に再確立する必要がないように、WebSockets 接続をページ間で維持する方法はありますか?

4

4 に答える 4

23

同じドメインの複数のページが実行コンテキストを共有できるようにする Shared WebWorker で WebSocket 接続を作成してみてください。ただし、Shared Workersがページのリロードまたは置換後も持続するかどうかは不明です。

また、Shared WebWorkers は現在、ブラウザーのサポート (Webkit と Opera) が制限されています。

更新：

1 つの共有 Web ワーカーで複数のページを処理できるため、実装は通常の Web ワーカーよりも少し複雑になります。

以下は、WebSocket を使用して共有できる共有 Web ワーカーの例です。

最初の HTML:

<!DOCTYPE html>
<html>
<body>
<script>
    var worker = new SharedWorker("shared.js");
    worker.port.addEventListener("message", function(e) {
        console.log("Got message: " + e.data);
    }, false);
    worker.port.start();
    worker.port.postMessage("start");
</script>
</body>
</html>

で共有ワーカーを実装する Javascript shared.js:

var ws = null
var url = "ws://" + location.hostname + ":6080"
self.addEventListener("connect", function(e) {
    var port = e.ports[0]
    port.addEventListener("message", function(e) {
        if (e.data === "start") {
            if (ws === null) {
                ws = new WebSocket(url);
                port.postMessage("started connection to " + url);
            } else {
                port.postMessage("reusing connection to " + url);
            }
        }
    }, false);
    port.start();
}, false);

これが Chrome 52 で動作することを確認しました。

于 2012-06-04T22:09:52.147 に答える
1

残念ながら、SPA アプリケーションでサイトを変更しない最もクリーンなソリューションは、1 つの ServiceWorker のみを使用して取得されます。これは、バックグラウンドで (タブを閉じた状態でも) ジョブを実行し、複数のタブの問題も解決するためです。「残念ながら」と言ったのは、まだほとんどのブラウザと互換性がないからです。

私が自分で見つけた唯一の解決策は、サーバー側でソケットチャネルをグループ化し、ページの変更によって失われたメッセージを保持するためにキューを作成することです。この場合、一種の仮想チャネルがあります。

于 2016-10-08T17:10:22.930 に答える