Simple cross window communication using localstorage

same-domain-post-message.js

(function() {

  var storage = window.localStorage;
  var browserId = Date.now() + (Math.random() * 1000);

  function get(key){
    var result = storage.getItem(key);
    if (typeof(result) == 'undefined') return result;
    return JSON.parse(result);
  }

  function set(key, data) {
    storage.setItem(key, JSON.stringify(data));
  }

  function getClients() {
    var clients = get('__crosswindow') || [];
    if (clients.length > 20) clients = clients.splice(0, 20);
    return clients;
  }

  function register(){
    var clients = getClients();
    clients.push(browserId);
    set('__crosswindow', clients);
  }

  function listen() {
    register();
    setInterval(function(){
      var messages = get(browserId) || [];
      if (!messages.length) return;
      set(browserId, []);
      messages.forEach(function(message){
        onMessage(message);
      });
    }, 1000);
  }

  function send(data) {
    var clients = getClients() || [];
    clients.forEach(function(client){
      if (client == browserId) return;
      var old = get(client) || [];
      if (old instanceof Array) {
        old.push(data);
        set(client, old);
      }
    });
  }


  function onMessage(data) {
    window.dispatchEvent(new CustomEvent('message', { 'detail': data }));
  }

  window.addEventListener("message", function(e) {
    if (e.origin !== window.location.origin) return;
    send(e.data + '');
  }, false);

  listen();
})();