มีไลบรารี JavaScript แบบโอเพ่นซอร์สที่ระบุหลายแท็บเบราว์เซอร์และสถานะไคลเอ็นต์สำหรับเบราว์เซอร์ใหม่หรือไม่ [ปิด]

มีคุณสมบัติใหม่ ๆ บางอย่างของ HTML5 ที่ทำให้มันกลายเป็นเบราว์เซอร์รุ่นล่าสุดที่อนุญาตให้แชร์สถานะระหว่างแท็บหน้าต่างเบราว์เซอร์หน้าต่างโดเมนเดียวกัน ฯลฯ ดังนั้นจึงอาจเป็นเรื่องง่ายขึ้นเล็กน้อยที่จะเขียนแอปพลิเคชันเว็บ ไคลเอนต์และยังจัดการสถานะอย่างชาญฉลาดระหว่างแท็บและ / หรือหน้าต่าง

ขณะนี้มีไลบรารีเช่น Backbone.js ที่สามารถช่วยจัดการสถานะในแท็บเดียวหรือหน้าต่างเดียว มีอะไรอีกบ้างที่ช่วยในการจัดการแท็บหลาย ๆ แท็บ (หรือหน้าต่าง) ทั่วโลกสถานะเฉพาะของแท็บและการจัดกิจกรรมข้ามแท็บโดยไม่ต้องอาศัยเซิร์ฟเวอร์เพื่อซิงค์ข้อมูลทั้งหมด

คำตอบสั้น ๆ :

คุณไม่สามารถอย่างแท้จริงผ่านข้อมูลของรัฐจากแท็บหนึ่งไปยังอีก ...

คำตอบยาว:

คุณไม่สามารถส่งผ่านข้อมูลสถานะจากแท็บหนึ่งไปยังอีกแท็บได้อย่างแท้จริงเนื่องจากจะเป็นการละเมิดช่องโหว่และการรักษาความปลอดภัยอย่างรุนแรง

อย่างไรก็ตามคุณสามารถผ่านสถานะทางอ้อมระหว่างสองแท็บได้โดยทาง:

• การสื่อสารระหว่างไคลเอนต์ - เซิร์ฟเวอร์ (WebSockets, AJAX call, ... ),
• ส่วนขยายเบราว์เซอร์ (พวกเขาสามารถได้รับอนุญาตให้ผ่านและบางเบราว์เซอร์มี API เพื่อใช้ระบบส่งข้อความเพื่อสื่อสารระหว่างหน้าพื้นหลังแท็บและสคริปต์เนื้อหา )

อีกทางเลือกหนึ่งคือการสื่อสารผ่านคุกกี้เพื่อส่งผ่านข้อมูลระหว่าง 2 แท็บ แต่สิ่งนี้น่าจะทำให้เกิดปัญหาขึ้นกับเบราว์เซอร์สูงและต้องการการโหลดหน้าใหม่(และเพื่อความซื่อสัตย์ฉันไม่เคยลองเลย แต่คนอื่น ๆ ได้ทำ มัน )

ดังนั้นเนื่องจากส่วนขยายเบราว์เซอร์เป็นเส้นทางที่ค่อนข้าง จำกัด คุณควรใช้วิธีการสื่อสารลูกค้า - เซิร์ฟเวอร์และพัฒนาระบบเพื่อให้ลูกค้าสามารถเผยแพร่กิจกรรมไปยังเซิร์ฟเวอร์จากนั้นส่งซ้ำอีกครั้ง (หรือการแพร่ภาพอื่น ๆ ) ให้กับลูกค้ารายอื่นผ่านโปรโตคอลการสื่อสารที่คุณเลือก

อัปเดต 1: ตามที่มีคนพูดถึงในความคิดเห็นก่อนที่จะลบออก (ไม่สามารถให้เครดิตเนื่องจากไม่แสดงในกล่องจดหมายขอโทษ)

HTML5 แนะนำwindow.postMessageAPI

สำหรับตัวอย่างการทำงานให้ดูที่จอห์นเรซิกบล็อกโพสต์ในข้ามหน้าต่างการส่งข้อความ และน่าสนใจมากถ้าคุณดูความคิดเห็นในโพสต์นี้คุณจะสังเกตเห็นคนที่เรียกว่าMalteพูดถึงห้องสมุดที่พวกเขาเขียนเพื่อใช้window.postMessageกับเบราว์เซอร์ที่ทันสมัยหรือรุ่นที่ใช้คุกกี้กับเบราว์เซอร์รุ่นเก่า

อ่านรายละเอียดและตัวอย่างเพิ่มเติมได้จาก:

• MDC 's window.postMessageหน้า
• เดวิดวอลช์ 's บล็อกโพสต์บน(สาธิตเสียแม้ว่า) ,window.postMessage
• ร่าง HTML5 เว็บ Messagingเอกสาร
• Ajaxianนี้เขียนขึ้นwindow.postMessageพร้อมลิงก์เพิ่มเติม

อัปเดต 2:

เก็บไว้ในใจว่าเป็น 2012/03/04 เป HTML5 ก็ยังคงเป็นร่างเพื่อให้คุณสมบัติบางอย่างอาจถูกลบออก ดังนั้นใช้ด้วยความระมัดระวัง ...

ฉันเพิ่งค้นพบอินเตอร์คอมซึ่งใช้ที่เก็บข้อมูลในเครื่องเพื่อส่งข้อความออกอากาศระหว่างหน้าต่าง ที่จัดเก็บในตัวเครื่องสร้างเหตุการณ์ ( onstorage) เมื่อข้อมูลมีการเปลี่ยนแปลงดังนั้นจึงไม่จำเป็นต้องทำการสำรวจ อินเตอร์คอมช่วยให้ทุกหน้าในโดเมนสามารถสื่อสารได้โดยไม่คำนึงถึงวิธีการเปิด

หากหน้าต่าง (หน้า) ของคุณมาจากโดเมนเดียวกัน (ต้นกำเนิด) คุณlocalStorageสามารถใช้เพื่อแชร์ข้อมูลและส่งข้อความ สิ่งหนึ่งที่คุณควรพิจารณาคือหน้าต่างเบราว์เซอร์แต่ละหน้า (หน้า) ทำงานในเธรดแยกต่างหาก ดังนั้นหากเรากำลังพูดถึงการสื่อสารข้ามหน้าต่างเรากำลังพูดถึงมัลติเธรด

คุณควรพิจารณาlocalStorageปัญหาบางอย่างกับ IE:

• ฉันได้ทำการทดสอบ localStorage ใน IE8 แล้ว หลังจากการเปลี่ยนแปลงหลายพันรายการใน localStorage หน้าต่างจากต้นกำเนิดเดียวกันจะหยุดรับเหตุการณ์ 'ที่เก็บข้อมูล' ยิ่งไปกว่านั้นคุณพยายามอ่านจากรายการ localStorage เดียวกันค่าอาจแตกต่างกันในหน้าต่างที่แตกต่างกัน ดังนั้นฉันจะบอกว่า IE8 ไม่สนับสนุน localStorage

• ตัวจัดการเหตุการณ์ IE9 และ IE10 เรียก 'storage' แม้ว่า localStorage จะถูกเปลี่ยนจากหน้าต่างนี้ ( ซึ่งขัดต่อข้อกำหนด )

• นอกจากนี้ยังมีปัญหาที่พบกับ IE11

ฉันเพิ่งเผยแพร่ไลบรารี่การสื่อสารระหว่างหน้าต่าง(คุณลักษณะทั้งหมดอธิบายไว้ใน readme) มันให้การแบ่งปันข้อมูลที่ปลอดภัยด้ายการออกอากาศเหตุการณ์ นอกจากนี้ยังแก้ปัญหา IE บางอย่าง (ไม่รองรับ IE8 แน่นอนข้อผิดพลาด IE11 พร้อม iframe ภายในพาเรนต์ต้นทางที่แตกต่างกันอาจแก้ไขได้โดยการแก้ไข IE เท่านั้น - กำลังรอการอัปเดต IE11)