MessagePort

Phương thức phiên bản

Kế thừa các phương thức từ đối tượng cha, EventTarget.

postMessage()

Gửi một tin nhắn từ cổng và tùy chọn, chuyển quyền sở hữu các đối tượng sang các browsing context khác.

start()

Bắt đầu gửi các tin nhắn đã được xếp hàng trong cổng (chỉ cần thiết khi dùng EventTarget.addEventListener; nó được ngụ ý khi dùng onmessage).

close()

Ngắt kết nối cổng, để nó không còn hoạt động nữa.

Sự kiện

Kế thừa sự kiện từ đối tượng cha, EventTarget.

message

Được kích hoạt khi đối tượng MessagePort nhận được một tin nhắn.

messageerror

Được kích hoạt khi đối tượng MessagePort nhận được tin nhắn không thể deserialize.

Ví dụ

Trong ví dụ dưới đây, bạn có thể thấy một channel mới được tạo bằng hàm khởi tạo MessageChannel().

Khi IFrame đã tải, chúng ta đăng ký handler onmessage cho MessageChannel.port1 và chuyển MessageChannel.port2 đến IFrame bằng phương thức window.postMessage cùng với tin nhắn.

Khi nhận được tin nhắn trả lại từ IFrame, hàm onMessage xuất tin nhắn vào đoạn văn.

const channel = new MessageChannel();
const output = document.querySelector(".output");
const iframe = document.querySelector("iframe");

// Wait for the iframe to load
iframe.addEventListener("load", onLoad);

function onLoad() {
  // Listen for messages on port1
  channel.port1.onmessage = onMessage;

  // Transfer port2 to the iframe
  iframe.contentWindow.postMessage("Hello from the main page!", "*", [
    channel.port2,
  ]);
}

// Handle messages received on port1
function onMessage(e) {
  output.innerHTML = e.data;
}

Để xem ví dụ đầy đủ đang hoạt động, hãy xem channel messaging basic demo trên GitHub (chạy trực tiếp).

Thông số kỹ thuật

Tương thích trình duyệt

Xem thêm

• Sử dụng channel messaging