Istnieje kilka nowych funkcji HTML5, które wprowadziły go do najnowszych przeglądarek, które umożliwiają udostępnianie stanu między kartami, oknami przeglądarki, oknami tej samej domeny itp. Więc prawdopodobnie łatwiej było napisać aplikację internetową, która utrzymuje dużo stanu na klient, a także inteligentnie zarządza stanem między kartami i / lub oknami.
Obecnie istnieją biblioteki takie jak Backbone.js, które mogą pomóc zarządzać stanem w pojedynczej zakładce lub pojedynczym oknie. Czy jest jeszcze coś, co pomaga w wielu kartach (lub oknach) zarządzających stanem globalnym, stanem specyficznym dla kart i zdarzeniami między kartami bez polegania na serwerze, aby zsynchronizować je wszystkie?
HTTP is great (and beutiful) because it is stateless. Odkąd dołączyłem do przemysłu, szukam tego, ale nie mogę go znaleźć. Wszyscy mówią tylko o zachowaniu stanów, które widzisz!Odpowiedzi:
Krótka odpowiedź:
Nie można naprawdę przekazywać informacji o stanie z jednej karty do drugiej ...
Długa odpowiedź:
Nie można naprawdę przekazywać informacji o stanie z jednej karty do drugiej, ponieważ byłoby to bardzo poważne naruszenie piaskownicy i bezpieczeństwa.
Możesz jednak pośrednio przekazać stan między dwiema zakładkami poprzez:
Inną opcją byłoby po prostu komunikowanie się za pomocą plików cookie w celu przekazywania informacji między dwiema kartami, ale najprawdopodobniej spowodowałoby to problemy, byłoby wysoce zależne od przeglądarki i wymagało ponownego załadowania strony (i szczerze mówiąc, nigdy tego nie próbowałem i tylko o tym myślałem, ale inni zrobić go ) .
Ponieważ rozszerzenia przeglądarki są oczywiście dość ograniczającą ścieżką, należy podążać drogą komunikacji klient-serwer i opracować system umożliwiający klientom publikowanie zdarzeń na serwerze, które następnie wysyłają je ponownie (lub jakikolwiek inny rodzaj transmisji) innym klientom za pośrednictwem wybranego protokołu komunikacyjnego.
Aktualizacja 1: Jak ktoś wspomniał w komentarzu przed jego usunięciem (nie może wyrazić uznania, ponieważ nie pojawia się w skrzynce odbiorczej, przepraszam)
HTML5 wprowadza
window.postMessageAPI.Przykładem może być post na blogu Johna Resiga na temat przesyłania wiadomości między oknami . I bardzo ciekawe, jeśli spojrzysz na komentarze do tego postu, zauważysz, że ktoś o imieniu Malte wspomina o bibliotece, którą napisali do użycia
window.postMessagew nowoczesnych przeglądarkach lub wersji opartej na plikach cookie w starszych przeglądarkach.Przeczytaj je, aby uzyskać więcej informacji i przykładów:
window.postMessagestrona,window.postMessagewindow.postMessagedodatkowe linki.Aktualizacja 2:
Należy pamiętać, że ponieważ 2012-03-04 specyfikacja HTML5 jest nadal wersją roboczą, więc niektóre funkcje można usunąć . Więc używaj ostrożnie ...
źródło
Niedawno odkryłem Intercom , który wykorzystuje lokalną pamięć masową do implementacji przesyłania komunikatów między oknami. Pamięć lokalna uruchamia zdarzenie (
onstorage) po zmianie danych, więc odpytywanie nie jest konieczne. Domofon umożliwia komunikację wszystkim stronom w domenie, niezależnie od tego, jak zostały otwarte.źródło
Jeśli twoje okna (strony) pochodzą z tej samej domeny (pochodzenia),
localStoragemożna ich używać do udostępniania danych i rozgłaszania wiadomości. Należy wziąć pod uwagę, że każde okno (strona) przeglądarki działa w osobnym wątku. Jeśli więc mówimy o komunikacji między oknami, mówimy również o wielowątkowości.Powinieneś również wziąć pod uwagę niektóre
localStorageproblemy z IE:Przeprowadziłem kilka testów dla localStorage w IE8. Po kilku tysiącach zmian w localStorage, okna z tego samego źródła przestają odbierać zdarzenia „przechowywania”. Co więcej, następnie spróbuj odczytać z tego samego elementu localStorage, wartości mogą się różnić w różnych oknach. Powiedziałbym, że IE8 nie obsługuje localStorage
IE9 i IE10 wywołują moduł obsługi zdarzeń „storage”, nawet jeśli localStorage zostanie zmienione z tego okna ( jest to niezgodne ze specyfikacją ).
Znane są również problemy z IE11 .
Niedawno opublikowałem bibliotekę komunikacji między oknami (wszystkie funkcje opisano w pliku readme). Zapewnia bezpieczne dla wątków udostępnianie danych, transmisję zdarzeń. Rozwiązuje również niektóre problemy z IE (IE8 zdecydowanie nie jest obsługiwany, błąd IE11 z ramką iframe wewnątrz rodzica innego pochodzenia może być rozwiązany tylko przez naprawę IE - czekając na aktualizację IE11).
źródło