Websockets + один экземпляр + кросс-таблица связи лучший способ? - PullRequest
0 голосов
/ 20 октября 2018

Я использую веб-сокеты для передачи сообщений json, но я не хочу, чтобы несколько ws-соединений были открыты, если открыто несколько вкладок.

Чтобы уменьшить количество соединений, я хочу реализовать один объект ws-соединения, который может отправлять /получать сообщения со всех вкладок на мой сайт.Объект должен пересылать json на все вкладки, и каждая вкладка будет обрабатывать сообщение.

Я смотрю на веб / общих / сервисных работников и не уверен, что путь 2018 для решения проблемы и браузерподдержка, похоже, тоже вызывает беспокойство.

Похоже, что общие работники не поддерживаются в Safari для поддержки сервисных работников.Похоже, что Chrome / FF / Opera поддерживает общих работников.

Короче, это немного сбивает с толку, немного путаницы, и я хочу узнать лучший путь вперед с лучшей поддержкой.

Если вызнаете хороший ресурс, пример кода для реализации ws с вашим предложенным методом, пожалуйста, предоставьте его также.

1 Ответ

0 голосов
/ 21 октября 2018

После дальнейших исследований я решил внедрить веб-работников.

На данный момент у меня есть успех, и я хотел добавить важную вещь, на которой я застрял для будущих читателей.

В моем файле worker.js я поместил это наверху, чтобы все началось.Функция importScripts выдавала ошибку, если я не делал этого иначе.

Также, ради справки, это мой скелетный код в моем файле worker.js, который работает.Обработка сообщений со страниц html отделена от сообщений ws, полученных с сервера.Вы можете запустить, остановить работника на html-странице.

Все вкладки будут получать сообщения от работника, каждая страница должна обрабатывать сообщения по мере необходимости.

Я также использую надежный-websockets, поэтому он автоматически переподключается с этим github, поскольку этот код работает с веб-работниками и поддерживаетсяЕсть еще один проект с таким же именем, который не был обновлен ко времени публикации.Переподключение-websockets не поддерживает веб-работников, и вы получите ошибку.- https://github.com/nathanboktae/robust-websocket

html

<script>
document.addEventListener('DOMContentLoaded', init);

function init(){
    worker = new Worker('js/ws_worker.js');
    worker.addEventListener('message', workerMessaged);

    worker.postMessage({ "args": '<username_admin>', "cmd": 'start', "url": '127.0.0.1:8000' });
    worker.postMessage({ "message": 'Initialize new worker'});
    console.log('Message posted to worker, start');
}

// Received a json message from the Worker, process it.
function workerMessaged(ev){
    console.log('Message received from worker');
    console.log(ev.data);
    worker.postMessage({ "cmd": 'message', "message": 'Sending reply over ws'});
}

worker.js

// proper initialization
if( 'function' === typeof importScripts) {
importScripts('robust-websocket.js');

var WebSocket;


self.addEventListener("message", function(e) {
    var args = e.data.args;
    var cmd = e.data.cmd;
    var roomName = e.data.args;
    var url = e.data.url;
    var message = e.data;
    // Code to process ws messages from the server
    WebSocket.onmessage = function(event) {
        console.log(" WebSocket message received: " + event.data, event);
        self.postMessage(event.data);
    };

    WebSocket.onerror = function(event) {
        console.log(" WebSocket message received: " + event.data, event);
        self.postMessage(event.data);
    };

    if (cmd === 'start') {
        WebSocket = new RobustWebSocket(
        'ws://' + url +
        '/ws/' + roomName + '/');

        console.log('Connected via websockets');

        /* Send initial message to open the connection and finalize the ws object*/
        WebSocket.onopen = function() {
            var obj = { "message": "hello" };
            var json = JSON.stringify(obj);
            WebSocket.send(json);
        };

    } else if (cmd === 'stop') {
        WebSocket.onclose = function() {
            console.log('Closing WebSocket');
            WebSocket.close();
            console.log('Closed WebSocket');
            console.log('Terminating Worker');
            self.close(); // Terminates the worker.
        };

    } else if (cmd === 'message') {
        WebSocket.onopen = function() {
            var json = JSON.stringify(message);
            WebSocket.send(json);
        };
        console.log('message sent over websocket');
        console.log('message');

    } else {
        console.log('logging error ' + e.data);
        console.log(e.data);
        self.postMessage('Unknown command: ');
    }

}, false);

};
...