Javascript; la comunicazione tra le schede / finestre con stessa origine [duplicare]

Question

    

Questa domanda ha già una risposta qui:

    

        
•              Comunicazione tra schede o finestre                                      9 risposte                          
    

    

Ho due finestre: la finestra A e B. finestra

• Finestra A e finestra B hanno lo stesso dominio
• Finestra A e finestra B non ha una finestra padre.

Domande:

1. È possibile che la finestra A per ottenere un riferimento di finestra B?
2. qual è il modo più elegante per rendere la finestra A notificare qualcosa da finestra B?
   (Tra cui nuove specifiche HTML5)

Due modi io sono consapevole di fare questo:

• messaggistica per server: dove finestra B regolarmente chiede al server se la finestra A ha comunicato qualcosa
• Messaggi dai dati locali (HTML5): quando la finestra A vuole comunicare qualcosa che cambia i dati locali, finestra B regolarmente controlla i dati locali per eventuali modifiche.

Ma le due vie non sono così elegante.
Per esempio sarebbe bello per ottenere un riferimento di finestra B e utilizzare window.postMessage () (HTML5)

ultimo obiettivo è quello di fare qualcosa di simile a Facebook, dove se si apre 4 schede di Facebook e chattare in una scheda, la chat è aggiornato in ogni scheda Facebook, che è pulito!

Answer 1

sto attaccando alla soluzione dati locali condivisi indicato nella domanda utilizzando localStorage. Sembra essere la soluzione migliore in termini di affidabilità, prestazioni e compatibilità con i browser.

localStorage è implementato in tutti i browser moderni.

L'evento storage quando altro schede apporta delle modifiche al localStorage. Questo è molto utile per scopi di comunicazione.

I riferimenti possono essere trovati qui:
Webstorage
Webstorage - evento di memorizzazione

Answer 2

Lo standard BroadcastChannel permette di fare questo. In questo momento è implementato in Firefox e Chrome ( caniuse , MDN ):

// tab 1
var ch = new BroadcastChannel('test');
ch.postMessage('some data');

// tab 2
var ch = new BroadcastChannel('test');
ch.addEventListener('message', function (e) {
    console.log('Message:', e.data);
});

Answer 3

SharedWorker è spec WHATWG / HTML5 per un processo comune che possono comunicare tra schede.

Answer 4

Hai detto che il tuo:

  

obiettivo utlimate è quello di fare qualcosa di simile a Facebook, dove se si apre 4 schede di facebook, e chattare in una scheda, la chat è attualizzare in ogni scheda facebook, wich è pulito!

Questo dovrebbe accadere come un sottoprodotto del vostro disegno, il punto di vista del modello di interrogazione (probabilmente il server) per gli aggiornamenti per la chat, piuttosto che la vostra dover progettare in cross-vista la comunicazione. A meno che non hai a che fare con il trasferimento di enormi quantità di dati, perché preoccuparsi? Sembra che sarà complicare le cose senza un guadagno enorme.

Anni fa ho scoperto che se ho fatto window.open utilizzando il nome di una finestra esistente e un URL vuoto, ho avuto un riferimento alla finestra esistente (questo comportamento è anche documentato sul MDC e un commento su noreferrer la documentazione MSDN suggerisce funziona in IE pure). Ma che era anni fa, non so come universale il supporto perché è nel mondo di oggi, e, naturalmente, non si avrà un nome di finestra per cercare a meno che tutte le finestre includono un iframe di nome per la comunicazione, con nome univoco tramite codice lato server, e quindi comunicato alle altre finestre per mezzo di codice lato server ... (pensiero spaventoso:. Questo potrebbe in realtà essere fattibile memorizzare i nomi "corrente" delle finestre relative a un utente collegato in conto in una tabella , dare l'elenco per ogni nuova finestra creata che accede quel conto, abbattere le vecchie voci inattive. Ma se la lista è un po 'fuori moda, si aprirà una nuova finestra per la ricerca di altri ... E scommetto supporto è incerto da browser per browser.)

Answer 5

Oltre alla prossima SharedWorker , è anche possibile utilizzare cross-documento messaggistica, che è molto più ampiamente supportato . In questo scenario, ci deve essere un una finestra principale che è responsabile per l'apertura di tutte le altre finestre con window.open. Le finestre figlie possono quindi utilizzare postMessage sul loro window.opener.

Se si utilizza il flash è un'opzione per voi, c'è anche la molto più vecchio LocalConnection virtualmente supportato su qualsiasi client con flash installato ( esempio di codice ).

Altri metodi fallback:
postMessage plug-in per jQuery con window.location.href fallback per browser meno recenti
soluzione basata su cookie per la comunicazione non istantanea

Answer 6

Per quanto ne sappia, non è possibile comunicare attraverso le finestre, se non hanno lo stesso genitore.

Se sono entrambi stati aperti da una finestra genitore, si dovrebbe essere in grado di entrare in possesso dei riferimenti alle variabili del genitore.

Nel genitore, aprire le finestre in questo modo:

childA = window.open(...);
childB = window.open(...)

in Childa, childB di accesso in questo modo:

childB = window.opener.childA

Answer 7

Ho un modo pulito di fare tale trucco, ma con restrizioni: si dovrebbe consentire i popup per il tuo dominio e si otterrà una pagina sempre aperta (come scheda o come pop-up) che attuerà le comunicazioni tra le finestre

.

Ecco un esempio: http://test.gwpanel.org/test/page_one.html (Refresh pagina dopo l'attivazione pop-up per il dominio)

La caratteristica principale di questo trucco - popup viene aperto con url frammento '#', alla fine, questo browser forza per non cambiare la posizione della finestra e memorizzare tutti i dati. E window.postMessage faccia il resto.