1 files changed, 120 insertions, 0 deletions
diff --git a/files/zh-cn/web/api/messageport/index.html b/files/zh-cn/web/api/messageport/index.html
new file mode 100644
index 0000000000..e16d395ebf
--- /dev/null
+++ b/files/zh-cn/web/api/messageport/index.html
@@ -0,0 +1,120 @@
+---
+title: MessagePort
+slug: Web/API/MessagePort
+tags:
+  - API
+  - Channel messaging
+  - HTML5
+  - Interface
+  - MessagePort
+  - Reference
+  - TopicStub
+translation_of: Web/API/MessagePort
+---
+<p>{{APIRef("HTML DOM")}}</p>
+
+<p><a href="/en-US/docs/Web/API/Channel_Messaging_API">Channel Messaging API</a> 的 <strong><code>MessagePort</code></strong> 接口代表 {{domxref("MessageChannel")}} 的两个端口之一， 它可以让你从一个端口发送消息，并在消息到达的另一个端口监听它们。</p>
+
+<p>{{AvailableInWorkers}}</p>
+
+<h2 id="方法">方法</h2>
+
+<p><em>继承自父类 {{domxref("EventTarget")}} 的方法</em></p>
+
+<dl>
+ <dt>{{domxref("MessagePort.postMessage")}}</dt>
+ <dd>从端口发送一条消息，并且可选是否将对象的所有权交给其他浏览器上下文。</dd>
+ <dt>{{domxref("MessagePort.start")}}</dt>
+ <dd>开始发送该端口中的消息队列 (只有使用 {{domxref("EventTarget.addEventListener")}} 的时候才需要调用；当使用 {{domxref("MessagePort.onmessage")}} 时，是默认开始的。)</dd>
+ <dt>{{domxref("MessagePort.close")}}</dt>
+ <dd>断开端口连接，它将不再是激活状态。</dd>
+</dl>
+
+<h2 id="事件回调">事件回调</h2>
+
+<p><em>继承自父类 {{domxref("EventTarget")}} 的事件回调</em></p>
+
+<dl>
+ <dt>{{domxref("MessagePort.onmessage")}}</dt>
+ <dd>是一个 {{domxref("EventListener")}}, 当类型为 <code>message</code> 的 {{domxref("MessageEvent")}} 在该端口触发时，它将会被调用──也就是说，该端口收到了一条消息。</dd>
+ <dt>{{domxref("MessagePort.onmessageerror","onmessageerror")}}</dt>
+ <dd>是一个 {{domxref("EventListener")}}, 当类型为 {{domxref("MessageError")}} 的 {{domxref("MessageEvent")}} 被触发时，它将会被调用──这意味着，端口收到了一条无法被反序列化的消息。</dd>
+</dl>
+
+<h2 id="事件">事件</h2>
+
+<dl>
+ <dt>{{domxref("MessagePort.message_event","message")}}</dt>
+ <dd>当 <code>MessagePort</code> 对象收到消息时会触发。<br>
+ 也可以通过 {{domxref("MessagePort.onmessage","onmessage")}} 属性使用。</dd>
+ <dt>{{domxref("MessagePort.messageerror_event","messageerror")}}</dt>
+ <dd>当 <code>MessagePort</code> 对象收到无法被反序列化的消息时触发。<br>
+ 也可以通过 {{domxref("MessagePort.onmessageerror","onmessageerror")}} 属性使用。</dd>
+</dl>
+
+<h2 id="例子">例子</h2>
+
+<p>在下面的例子中，你可以看到一个使用 {{domxref("MessageChannel.MessageChannel","MessageChannel()")}} 构造函数创建出的新 channel. </p>
+
+<p>当 IFrame 加载完成后，我们给 {{domxref("MessageChannel.port1")}} 注册了一个 {{domxref("MessagePort.onmessage","onmessage")}} 回调，并且使用 {{domxref("window.postMessage")}} 方法把  {{domxref("MessageChannel.port2")}} 和一条消息一起传给 IFrame.</p>
+
+<p>当从 IFrame 收到消息时，<code>onMessage</code> 方法会把消息输出到一个段落里。</p>
+
+<pre class="notranslate">var channel = new MessageChannel();
+var output = document.querySelector('.output');
+var iframe = document.querySelector('iframe');
+
+// 等待 iframe 加载
+iframe.addEventListener("load", onLoad);
+
+function onLoad() {
+  // 监听 port1 的事件
+  channel.port1.onmessage = onMessage;
+
+  // 把 port2 传给 iframe
+  iframe.contentWindow.postMessage('Hello from the main page!', '*', [channel.port2]);
+}
+
+
+// 处理 port1 收到的消息
+function onMessage(e) {
+  output.innerHTML = e.data;
+}</pre>
+
+<p>要查看可运行的完整示例，参考我们在 Github 上的 <a class="external external-icon" href="https://github.com/mdn/channel-messaging-basic-demo">channel messaging basic demo</a> (<a class="external external-icon" href="http://mdn.github.io/channel-messaging-basic-demo/">也可以在线运行</a>).</p>
+
+<h2 id="规范">规范</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', '#message-ports','MessagePort')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>No difference from {{SpecName("HTML5 Web Messaging")}}.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 Web Messaging', '#message-ports','MessagePort')}}</td>
+   <td>{{Spec2('HTML5 Web Messaging')}}</td>
+   <td>W3C version of the spec</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="浏览器兼容性">浏览器兼容性</h2>
+
+<div class="hidden">
+<p>The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
+</div>
+
+<p>{{Compat("api.MessagePort")}}</p>
+
+<h2 id="参见">参见</h2>
+
+<ul>
+ <li>使用<a href="/en-US/docs/Web/API/Channel_Messaging_API/Using_channel_messaging"> channel messaging</a></li>
+</ul>