Межстраничное общение в WWW?

Question

Есть ли способ сделать межпроцессную связь на стороне клиента между несколькими веб-страницами в javascript? В идеале я бы хотел сделать это без какого-либо сложного обновления статуса сервера, ping и т. Д. И заставить его работать исключительно на клиенте. Если бы я мог сделать этот кросс-браузер, я был бы на небесах ха-ха. Есть идеи? Благодаря!

Answer 1

Существует много способов взаимодействия между окнами. Это Window.postMessage, локальное хранилище, WebRTC и в настоящее время общие веб-работники.

Каждый из них имеет свои собственные преимущества/недостатки:

• Local Storage работает только на тот же происхождения страниц (происхождение протокол: // сайт: порт). Он также транслирует сообщение в каждое открытое окно с одним и тем же источником, поэтому он медленный, если у вас открыто много страниц). К сожалению, это единственный кросс-окном, поддерживаемый IE11 и ниже.
• Общие работники поддерживаются только в Chrome и Firefox (и поддерживает только одно и то же происхождение, а файл worker.js должен загружаться из одного источника). Вы также должны «ретранслировать» трафик связи с одной страницы на другую.
• Window.postMessage работает только между родительскими/дочерними окнами, но поддерживает кросс-начало!

Выполнение взаимного обмена сообщениями между двумя независимыми веб-сайтами действительно неуклюже. Вам нужно либо выполнить window.open() с первого веб-сайта, либо использовать postMessage для связи со вторым веб-сайтом, или вам нужно настроить эту запутанную архитектуру, где вы используете скрытые iframes на каждом сайте для общения с веб-страницей на том же адресе веб-сайта, и эти iframe затем разговаривают друг с другом через локальное хранилище или общий рабочий. Это называется «узлом связи». (Довольно сложно, правда?)

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

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

• Endpoint.js - библиотека (отказ от ответственности) я разработал которая опосредует связь между окнами (на нескольких истоков), закладки, веб-рабочие, клиент/сервер, а также IPC между процессами. Он также создает специальную оверлейную сеть, которая позволяет всем этим методам передавать информацию друг другу.
• crosstab - Реализует подход «концентратор связи» выше.
• ozp-iwc - Структура IPC от Ozone Widget Framework. Включает локальное хранилище и почтовое отправление

Answer 2

Дайте попробовать на этот код для message writer

function sendMessage(name, value) { 
    var expires = ""; 
    document.cookie = name + "=" + value + expires + "; path=/"; 
} 

sendMessage("test", "hello world!") 

Открыть второе окно и try this message listener

function getMessage(c_name) { 
    if (document.cookie.length > 0) { 
     c_start = document.cookie.indexOf(c_name + "="); 
     if (c_start != -1) { 
      c_start = c_start + c_name.length + 1; 
      c_end = document.cookie.indexOf(";", c_start); 
      if (c_end == -1) { 
       c_end = document.cookie.length; 
      } 
      return unescape(document.cookie.substring(c_start, c_end)); 
     } 
    } 
    return ""; 
} 
function check() { 
    var message = getMessage('test'); 
    var element = document.getElementById('output'); 
    element.innerHTML = message; 
} 
window.setInterval(check, 1000); 

Это прекрасно работает на Chrome, вы также должны получить, что он работает в другой главный браузер, специально для IE