Existem bibliotecas JavaScript de código aberto que abordam várias guias do navegador e o estado do cliente para navegadores mais recentes? [fechadas]

Fechadas. Esta questão está fora de tópico . No momento, não está aceitando respostas.

Deseja melhorar esta pergunta? Atualize a pergunta para que ela esteja no tópico do Software Engineering Stack Exchange.

Fechado há 5 anos .

Existem alguns recursos novos do HTML5 que chegaram aos navegadores recentes que permitem o compartilhamento de estado entre guias, janelas do navegador, mesmas janelas de domínio etc. Por isso, provavelmente ficou um pouco mais fácil escrever um aplicativo da Web que mantenha muito estado no cliente e também gerencia o estado de maneira inteligente entre guias e / ou janelas.

Atualmente, existem bibliotecas como o Backbone.js que podem ajudar a gerenciar o estado em uma única guia ou em uma única janela. Ainda existe alguma coisa lá fora que ajude com várias guias (ou janelas) a gerenciar o estado global, o estado específico da guia e os eventos com guias cruzadas sem depender do servidor para sincronizá-las?

— psr
fonte

Alguns aplicativos da Web (por exemplo, Trello) estão ignorando isso usando WebSockets para sincronizar todos os clientes, seja no mesmo navegador ou não. Mas poderia ser útil. Se eu estivesse escrevendo uma biblioteca como essa, faria uma fina camada sobre um polyfill para o SharedWorkers, pois o SharedWorkers faz muito do que você precisa aqui, mas ainda não é bem suportado. Um truque para fazer isso funcionar são os eventos localStorage, que são acionados mesmo quando as guias foram abertas independentemente.

— mahemoff 23/02

Meu professor da faculdade me ensinou isso HTTP is great (and beutiful) because it is stateless. Desde que entrei na indústria, estou em busca desse beuty, mas não consigo encontrá-lo. Todo mundo fala apenas em manter os estados que você vê!

— Dipan Mehta

@DipanMehta: se você olhar para a RFC2616, não tenho certeza se você concorda com o seu professor sobre a parte "beleza" :) Embora eu deva dizer que a idéia "sem estado de estado de espírito" é realmente ótima e acho problemática que estamos massacrando-lo ...

— haylem

Os aplicativos sem estado e da Web não vão tão bem juntos. Pequenas coisas como estar logado no estado de transporte. Ótimo se você estiver apenas servindo arquivos bastante pequenos para quem pedir, eu acho.

— Psr

Escrevi uma pequena biblioteca para se comunicar entre todas as guias abertas do seu site usando um truque HTML5.

— catamphetamine 28/03

Respostas:

Resposta curta:

Você não pode realmente transmitir informações de estado de uma guia para outra ...

Resposta longa:

Você não pode realmente transmitir informações de estado de uma guia para outra, pois isso seria uma violação muito grave do sandbox e da segurança.

No entanto, você pode passar indiretamente o estado entre duas guias por meio de:

comunicações cliente-servidor (WebSockets, chamadas AJAX, ...),
extensões de navegador (elas podem ser ignoradas e alguns navegadores oferecem APIs para implementar um sistema de transmissão de mensagens para se comunicar entre páginas de segundo plano, guias e scripts de conteúdo ),

Outra opção seria simplesmente se comunicar por meio de cookies para passar informações entre duas guias, mas isso provavelmente causaria problemas, seria altamente dependente do navegador e exigiria recarregamentos de página (e, para ser sincero, nunca tentei isso e pensei apenas nisso, mas outros têm feito isso ) .

Portanto, como as extensões do navegador são obviamente um caminho bastante limitador, você deve seguir o caminho das comunicações cliente-servidor e desenvolver um sistema para permitir que os clientes publiquem eventos em um servidor, que os despache novamente (ou qualquer outro tipo de transmissão) para outros clientes através de um protocolo de comunicação de sua escolha.

Atualização 1: como alguém mencionado em um comentário antes de removê-lo (não pode dar crédito, pois não aparece na caixa de entrada, desculpe)

O HTML5 apresenta a window.postMessageAPI.

Para um exemplo de trabalho, consulte a postagem do blog de John Resig sobre Mensagens entre janelas . E muito interessante, se você olhar para os comentários desta postagem, notará alguém chamado Malte mencionando uma biblioteca que eles escreveram para usar window.postMessageem navegadores modernos ou uma versão baseada em cookie em navegadores mais antigos.

Leia estes para mais detalhes e exemplos:

MDC 's window.postMessagepágina,
O post de David Walsh no (demo ainda está quebrado) ,window.postMessage
o rascunho do documento HTML5 Web Messaging ,
este Ajaxian write-up em window.postMessagecom links adicionais.

Atualização 2:

Lembre-se de que, como 04/03/2012, a especificação HTML5 ainda é um rascunho; portanto, alguns recursos podem ser removidos . Portanto, use com cuidado ...

— haylem
fonte

Aparentemente, estou errado, pois o HTML5 apresenta a API window.postMessage, de fato.

— precisa saber é

Além disso, se você ler a postagem do blog de John Resig sobre Mensagens entre janelas e os comentários, notará alguém chamado Malte mencionando uma [biblioteca] [3] que eles escreveram para usar isso em navegadores modernos ou em uma versão baseada em cookie para navegadores mais antigos, então minha coisa de cookie não era tão louca.

— precisa saber é

Descobri recentemente o Intercom , que usa armazenamento local para implementar mensagens de difusão entre janelas. O armazenamento local dispara um evento ( onstorage) quando os dados são alterados, portanto, nenhuma pesquisa é necessária. O interfone permite que todas as páginas em um domínio se comuniquem, independentemente de como foram abertas.

— josh3736
fonte

Se suas janelas (páginas) forem do mesmo domínio (origem), localStoragepoderão ser usadas para compartilhar dados e transmitir mensagens. Uma coisa que você deve considerar é que cada janela (página) do navegador funciona em um thread separado. Portanto, se estamos falando sobre comunicação entre janelas, também estamos falando sobre multithreading.

Você também deve considerar alguns localStorageproblemas com o IE:

Eu realizei alguns testes para localStorage no IE8. Após vários milhares de alterações no localStorage, janelas da mesma origem param de receber eventos de 'armazenamento'. Ainda mais, se você tentar ler do mesmo item localStorage, os valores poderão ser diferentes em janelas diferentes. Então, eu diria que o IE8 não suporta localStorage
O IE9 e o IE10 chamam o manipulador de eventos 'storage', mesmo que localStorage seja alterado nessa janela ( isso é contra a especificação ).
Também há problemas conhecidos com o IE11 .

Publiquei recentemente a biblioteca de comunicação entre janelas (todos os recursos são descritos em leia-me). Ele fornece compartilhamento de dados seguros para threads, transmissão de eventos. Ele também resolve alguns problemas do IE (o IE8 definitivamente não é suportado, o bug do IE11 com iframe dentro de pai de origem diferente pode ser resolvido apenas pela correção do IE - aguardando atualização do IE11).

— Eugene Khudoy
fonte