การสื่อสารสองทางระหว่างบริบทการสืบค้นใน HTML5

การสื่อสารแบบสองทางระหว่างบริบทการสืบค้นเรียกว่าการส่งข้อความผ่านช่องทาง มีประโยชน์สำหรับการสื่อสารจากหลายแหล่ง

ขณะสร้าง messageChannel จะสร้างพอร์ตสองพอร์ตภายในเพื่อส่งข้อมูลและส่งต่อไปยังบริบทการสืบค้นอื่น

• postMessage() − โพสต์ช่องทางการส่งข้อความ
• เริ่ม () − มันส่งข้อมูล
• ปิด() − มันปิดพอร์ต

ในสถานการณ์นี้ เรากำลังส่งข้อมูลจาก iframe หนึ่งไปยัง iframe อื่น เรากำลังเรียกใช้ข้อมูลในฟังก์ชันและส่งข้อมูลไปยัง DOM

var loadHandler = function(){
   var mc, portMessageHandler;
   mc = new MessageChannel();
   window.parent.postMessage('documentAHasLoaded','https://foo.example',[mc.port2]);
   portMessageHandler = function(portMsgEvent){
      alert( portMsgEvent.data );
   }
   mc.port1.addEventListener('message', portMessageHandler, false);
   mc.port1.start();
}
window.addEventListener('DOMContentLoaded', loadHandler, false);