Как можно делиться одним ресурсом js между вкладками браузера?

Например, я хочу обновлять сообщения чата с помощью нескольких вкладок с помощью socket.io, longpolling и т.д.... что бы я ни имел... Для этого я хочу использовать только одно соединение для всех вкладок. Как я могу это сделать? Я могу хранить общие данные в localStore, файлы cookie и т.д. И мне нужен какой-то семафор, который дает только один ресурс синхронизатора на одну из вкладок, и после закрытия этой вкладки она дает другую вкладку и т.д... Как это возможно? Единственное решение, появившееся у меня в голове, сказать localStore с onbeforeunload, что ресурс бесплатный, но это не работает в каждом браузере. Есть ли другой вариант?

Ответ 1

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

Одно решение похоже на длительный опрос: inter-tab-communication-using-local-storage/ Периодически запрашивать изменения localStore/cookies и добавлять очередь для выделения общие ресурсы (например, соединение socket.io). Вы можете использовать onbeforeunload или таймаут, чтобы определить, перемещена ли вкладка/окно или закрыта. После этого в ближайшее время следующая вкладка в очереди будет выделять ресурс...

Второе решение - использовать "события хранения локального хранилища" для них. В этом случае вам не нужно периодически запрашивать localStore (если доступно событие onbeforeunload). В соответствии с этим: localStorage eventHandler не вызывается события хранилища предназначены для воздействия только на другие вкладки, поэтому они являются хорошим выбором для межтабличной связи. Единственная проблема - onunload: локальное хранилище при выгрузке окна. Поэтому из-за отсутствия поддержки onunload первое решение может быть лучше.

Третьим решением будет использование "общих веб-мастеров", но они еще не реализованы в нескольких браузерах (Internet Explorer), или они не могут открыть сокет (firefox). Так что в настоящее время они не являются вариантом, может быть, через 1-2 года после исправления ошибок... Вот только демонстрационная работа - html5-shared-web-worker-examples.

Четвертое решение будет window.postMessage, которое в настоящее время не имеет полной поддержки браузера. Я читал об этом в некоторых вопросах, и все они писали, что postMessage не способен на то, что мы хотим. Я не проверял точные данные об этой функции, это не стоит того времени, о котором я думаю... Существует пример перекрестного межсетевого обмена iframe: Междоменная iframe-связь но односвязное взаимодействие с одним и тем же доменом невозможно, я думаю.

Пятое решение будет использовать файлы cookie, но в этом случае каждая вкладка должна выполнить ping document.cookie, потому что там нет события изменения файла cookie, например события хранения в локальном хранилище. BNC Connector использует этот подход.

Шестое решение будет использовать WebSQL. Его драйвер async не блокирует, поэтому он будет лучше, чем localStorage, но в настоящее время он не поддерживается firefox и msie.

Вывод:

В настоящее время - 2013.10.03 - лучший вариант для периодического пинга localStore с вкладки утилиты ресурсов. Остальные вкладки должны прослушивать событие хранения обновлений временных меток. Если это событие не пришло вовремя, то вкладка утилита ресурсов имеет тайм-аут, а следующая вкладка в очереди должна получить ресурс. Возможно, позже событие onunload или общие сотрудники будут надежными, но в настоящее время они недостаточно хороши...

Решение:

Я нашел реализацию подхода, описанного в заключении: intercom.js Я добавил issue об общем интерфейсе совместного использования ресурсов, но в моем случае единственный ресурс socket.io достаточно хорош...