Có thư viện JavaScript mã nguồn mở giải quyết nhiều tab trình duyệt và trạng thái máy khách cho các trình duyệt mới hơn không? [đóng cửa]

Có một vài tính năng HTML5 mới đã đưa nó vào các trình duyệt gần đây cho phép chia sẻ trạng thái giữa các tab, cửa sổ trình duyệt, cùng cửa sổ tên miền, v.v. Vì vậy, có lẽ việc viết một ứng dụng web giữ nhiều trạng thái trên khách hàng và cũng quản lý trạng thái thông minh giữa các tab và / hoặc cửa sổ.

Hiện tại có các thư viện như Backbone.js có thể giúp quản lý trạng thái trong một tab hoặc một cửa sổ duy nhất. Có bất cứ điều gì ngoài đó giúp với nhiều tab (hoặc cửa sổ) quản lý trạng thái toàn cầu, trạng thái cụ thể của tab và sự kiện tab chéo mà không cần dựa vào máy chủ để đồng bộ hóa tất cả chúng không?

Câu trả lời ngắn:

Bạn thực sự không thể chuyển thông tin trạng thái từ tab này sang tab khác ...

Câu trả lời dài:

Bạn không thể thực sự chuyển thông tin trạng thái từ tab này sang tab khác, vì đây sẽ là một sự vi phạm rất nghiêm trọng về hộp cát và bảo mật.

Tuy nhiên, bạn có thể gián tiếp chuyển trạng thái giữa hai tab bằng cách:

• liên lạc giữa máy khách và máy chủ (WebSockets, cuộc gọi AJAX, ...),
• tiện ích mở rộng trình duyệt (chúng có thể được phép bỏ qua và một số trình duyệt cung cấp API để triển khai hệ thống chuyển tin nhắn để giao tiếp giữa các trang nền, tab và tập lệnh nội dung ),

Một tùy chọn khác chỉ đơn giản là giao tiếp qua cookie để truyền thông tin giữa 2 tab, nhưng điều này rất có thể gây ra sự cố, phụ thuộc nhiều vào trình duyệt và yêu cầu tải lại trang (và thành thật mà nói, tôi chưa bao giờ thử điều đó và chỉ nghĩ về nó, nhưng những người khác đã làm điều đó ) .

Vì vậy, vì tiện ích mở rộng trình duyệt rõ ràng là một đường dẫn khá hạn chế, bạn nên đi theo cách liên lạc giữa máy khách và máy chủ để phát triển hệ thống cho phép khách hàng xuất bản sự kiện lên máy chủ, sau đó gửi lại chúng (hoặc bất kỳ loại phát sóng nào khác) cho các khách hàng khác thông qua một giao thức truyền thông bạn chọn.

Cập nhật 1: Như ai đó đã đề cập trong một nhận xét trước khi xóa nó (không thể cung cấp tín dụng vì nó không hiển thị trong hộp thư đến, xin lỗi)

HTML5 giới thiệu window.postMessageAPI.

Để biết ví dụ hoạt động, hãy xem bài đăng trên blog của John Resig trên Nhắn tin qua cửa sổ . Và thật thú vị, nếu bạn nhìn vào các bình luận trên bài đăng này, bạn sẽ nhận thấy ai đó tên Malte đề cập đến một thư viện mà họ đã viết để sử dụng window.postMessagetrên các trình duyệt hiện đại hoặc phiên bản dựa trên cookie trên các trình duyệt cũ hơn.

Đọc những điều này để biết thêm chi tiết và ví dụ:

• MDC 's window.postMessagetrang,
• Bài đăng trên blog của David Walsh (bản demo đã bị hỏng) ,window.postMessage
• các dự thảo HTML5 Tin nhắn Web tài liệu,
• viết lên Ajaxian này window.postMessagevới các liên kết bổ sung.

Cập nhật 2:

Hãy nhớ rằng, như 2012-03-04, đặc tả HTML5 vẫn là bản nháp, vì vậy một số tính năng có thể bị xóa . Vì vậy, sử dụng cẩn thận ...

Gần đây tôi đã phát hiện ra liên lạc nội bộ , sử dụng bộ nhớ cục bộ để thực hiện nhắn tin quảng bá giữa các cửa sổ. Bộ nhớ cục bộ kích hoạt một sự kiện ( onstorage) khi dữ liệu thay đổi, do đó không cần bỏ phiếu. Liên lạc cho phép tất cả các trang trên một miền để giao tiếp, bất kể chúng được mở như thế nào.

Nếu các cửa sổ (trang) của bạn đến từ cùng một tên miền (nguồn gốc), localStoragecó thể được sử dụng để chia sẻ dữ liệu và để truyền phát thông điệp. Một điều bạn nên xem xét là mỗi cửa sổ trình duyệt (trang) hoạt động trong một luồng riêng biệt. Vì vậy, nếu chúng ta đang nói về giao tiếp qua cửa sổ, chúng ta cũng đang nói về đa luồng.

Bạn cũng nên xem xét một số localStoragevấn đề với IE:

• Tôi đã thực hiện một số thử nghiệm cho localStorage trong IE8. Sau vài ngàn thay đổi đối với localStorage, các cửa sổ từ cùng nguồn gốc sẽ ngừng nhận các sự kiện 'lưu trữ'. Thậm chí nhiều hơn, sau đó bạn cố gắng đọc từ cùng một mục localStorage, các giá trị có thể khác nhau trong các cửa sổ khác nhau. Vì vậy, tôi muốn nói rằng IE8 không hỗ trợ localStorage

• Trình xử lý sự kiện 'lưu trữ' của IE9 và IE10 ngay cả khi localStorage bị thay đổi từ cửa sổ này ( điều này trái với đặc điểm kỹ thuật ).

• Cũng có những vấn đề được biết đến với IE11 .

Gần đây tôi đã xuất bản thư viện liên lạc giữa các bên (tất cả các tính năng được mô tả trong readme). Nó cung cấp chia sẻ dữ liệu an toàn chủ đề, phát sóng sự kiện. Nó cũng giải quyết một số vấn đề về IE (IE8 chắc chắn không được hỗ trợ, lỗi IE11 với iframe bên trong nguồn gốc khác nhau chỉ có thể được khắc phục bằng cách sửa lỗi IE - chờ cập nhật IE11).