initial commit

6 files changed, 860 insertions, 0 deletions

diff --git a/files/zh-tw/websockets/index.html b/files/zh-tw/websockets/index.html
new file mode 100644
index 0000000000..3cbb630f41
--- /dev/null
+++ b/files/zh-tw/websockets/index.html
@@ -0,0 +1,155 @@
+---
+title: WebSockets
+slug: WebSockets
+tags:
+  - WebSockets
+translation_of: Web/API/WebSockets_API
+---
+<p>{{ SeeCompatTable() }}</p>
+<p>WebSocket 是一種讓瀏覽器與伺服器進行一段互動通訊的技術。這個 API 在不必輪詢（poll）伺服器下，讓使用者傳送訊息至伺服器並接受事件驅動回應。</p>
+<table class="topicpage-table">
+ <tbody>
+  <tr>
+   <td>
+    <h4 id="Documentation" name="Documentation"><a href="/Special:Tags?tag=WebSockets&amp;language=zh-tw" title="Special:Tags?tag=WebSockets&amp;language=zh-tw">文件</a></h4>
+    <dl>
+     <dt>
+      <a href="/zh_tw/WebSockets/Writing_WebSocket_client_applications" title="zh tw/WebSockets/Writing WebSocket client applications">製作 WebSocket 客戶端應用程式</a></dt>
+     <dd>
+      指導如何製作在瀏覽器上跑 WebSocket 客戶端的教程。</dd>
+     <dt>
+      <a href="/zh_tw/WebSockets/WebSockets_reference" title="zh tw/WebSockets/WebSockets reference">WebSockets 參考手冊</a></dt>
+     <dd>
+      客戶端的 WebSocket API 參考手冊。</dd>
+     <dt>
+      <a href="/en/WebSockets/The_WebSocket_protocol" title="en/WebSockets/The WebSocket protocol">The WebSocket protocol</a></dt>
+     <dd>
+      WebSocket 協定參考。</dd>
+     <dt>
+      <a href="/en/WebSockets/Writing_WebSocket_servers" title="en/WebSockets/Writing WebSocket servers">Writing WebSocket servers</a></dt>
+     <dd>
+      處理 WebSocket 協定的伺服器端代碼書寫指引。</dd>
+    </dl>
+    <p><span class="alllinks"><a href="/Special:Tags?tag=WebSockets&amp;language=zh-tw" title="Special:Tags?tag=WebSockets&amp;language=zh-tw">所有文件...</a></span></p>
+   </td>
+   <td>
+    <h4 id="Tools" name="Tools">工具</h4>
+    <ul>
+     <li><a class="external" href="http://socket.io" title="http://socket.io/">Socket.IO</a>：一個強大的跨平台 WebSocket API，建構在 <a class="external" href="http://cnodejs.org/" title="http://cnodejs.org/">Node.js</a> 之上。</li>
+     <li><a class="link-https" href="https://github.com/Worlize/WebSocket-Node" title="https://github.com/Worlize/WebSocket-Node">WebSocket-Node</a>：一個 WebSocket 伺服器 API 的實作，建構在 <a class="external" href="http://cnodejs.org/" title="http://cnodejs.org/">Node.js</a> 之上。</li>
+    </ul>
+    <p> </p>
+    <h4 id="Related_Topics" name="Related_Topics">相關主題</h4>
+    <dl>
+     <dd>
+      <a href="/zh_tw/AJAX" title="zh_tw/AJAX">AJAX</a>、<a href="/zh_tw/JavaScript" title="zh_tw/JavaScript">JavaScript</a></dd>
+    </dl>
+   </td>
+  </tr>
+ </tbody>
+</table>
+<h2 id="參見">參見</h2>
+<ul>
+ <li><a class="external" href="http://dev.w3.org/html5/websockets/" title="http://dev.w3.org/html5/websockets/">WebSocket API Specification</a></li>
+ <li><a href="/en/Server-sent_events" title="en/Server-sent events">Server-Sent Events</a></li>
+</ul>
+<h2 id="瀏覽器兼容">瀏覽器兼容</h2>
+<p>{{ CompatibilityTable() }}</p>
+<div id="compat-desktop">
+ <table class="compat-table">
+  <tbody>
+   <tr>
+    <th>功能</th>
+    <th>Chrome</th>
+    <th>Firefox (Gecko)</th>
+    <th>Internet Explorer</th>
+    <th>Opera</th>
+    <th>Safari</th>
+   </tr>
+   <tr>
+    <td>版本 -76 {{ obsolete_inline() }}</td>
+    <td>6</td>
+    <td>{{ CompatGeckoDesktop("2.0") }}</td>
+    <td>{{ CompatNo() }}</td>
+    <td>11.00 (禁用)</td>
+    <td>5.0.1</td>
+   </tr>
+   <tr>
+    <td>協定版本 7</td>
+    <td>{{ CompatNo() }}</td>
+    <td>
+     <p>{{ CompatGeckoDesktop("6.0") }}</p>
+     <div class="note">
+      請用 <code>MozWebSocket</code>。</div>
+    </td>
+    <td>{{ CompatNo() }}</td>
+    <td>{{ CompatNo() }}</td>
+    <td>{{ CompatNo() }}</td>
+   </tr>
+   <tr>
+    <td>協定版本 10</td>
+    <td>14</td>
+    <td>
+     <p>{{ CompatGeckoDesktop("7.0") }}</p>
+     <div class="note">
+      請用 <code>MozWebSocket</code>。</div>
+    </td>
+    <td>HTML5 Labs</td>
+    <td>{{ CompatUnknown() }}</td>
+    <td>{{ CompatUnknown() }}</td>
+   </tr>
+  </tbody>
+ </table>
+</div>
+<div id="compat-mobile">
+ <table class="compat-table">
+  <tbody>
+   <tr>
+    <th>功能</th>
+    <th>Android</th>
+    <th>Firefox Mobile (Gecko)</th>
+    <th>IE Mobile</th>
+    <th>Opera Mobile</th>
+    <th>Safari Mobile</th>
+   </tr>
+   <tr>
+    <td>版本 -76 {{ obsolete_inline() }}</td>
+    <td>{{ CompatUnknown() }}</td>
+    <td>{{ CompatUnknown() }}</td>
+    <td>{{ CompatUnknown() }}</td>
+    <td>{{ CompatUnknown() }}</td>
+    <td>{{ CompatUnknown() }}</td>
+   </tr>
+   <tr>
+    <td>協定版本 7</td>
+    <td>{{ CompatUnknown() }}</td>
+    <td>{{ CompatUnknown() }}</td>
+    <td>{{ CompatUnknown() }}</td>
+    <td>{{ CompatUnknown() }}</td>
+    <td>{{ CompatUnknown() }}</td>
+   </tr>
+   <tr>
+    <td>協定版本 8 (IETF 草案 10)</td>
+    <td>{{ CompatUnknown() }}</td>
+    <td>{{ CompatGeckoMobile("7.0") }}</td>
+    <td>{{ CompatUnknown() }}</td>
+    <td>{{ CompatUnknown() }}</td>
+    <td>{{ CompatUnknown() }}</td>
+   </tr>
+  </tbody>
+ </table>
+</div>
+<h3 id="Gecko_附註">Gecko 附註</h3>
+<p>Firefox 的 WebSockets 支援正在持續追蹤發展中的 WebSocket 規範。Firefox 6 實作底層協定版號 7，Firefox 7 實作協定版號 8（IETF 草案 10 的內容）。Firefox mobile 在 7.0 版支援 WebSocket。</p>
+<div class="geckoVersionNote">
+ <p>{{ gecko_callout_heading("6.0") }}</p>
+ <p>Gecko 6.0 {{ geckoRelease("6.0") }} 之前，不該存在的 <code>WebSocket</code> 物件使得某些開發者認為 <code>WebSocket</code> 服務沒有前輟，此物件已被更名為 <code>MozWebSocket</code>。</p>
+</div>
+<div class="geckoVersionNote">
+ <p>{{ gecko_callout_heading("7.0") }}</p>
+ <p>自從 Gecko 7.0 {{ geckoRelease("7.0") }}，偏好設定 <code>network.websocket.max-connections</code> 可以用來設定 WebSocket 連線同時開啟的最大個數。預設值為 200。</p>
+</div>
+<div class="warning">
+ <strong>警告：</strong>雖然不是唯一的理由，但是目前 WebSockets 被 Firefox 4 與 5 禁用的關鍵原因是一個<a class="external" href="http://www.ietf.org/mail-archive/web/hybi/current/msg04744.html" title="http://www.ietf.org/mail-archive/web/hybi/current/msg04744.html">協定設計上的安全問題</a>，因此不建議在生產環境下使用這些 Firefox 版本的 WebSockets。若仍想測試 WebSockets，你可以開啟 <code>about:config</code> 並設定 <code>network.websocket.enabled</code> 的取值至 <code>true</code>，並需要同時設定 <code>network.websocket.override-security-block</code> 的取值至 <code>true</code> 才能允許 WebSocket 連線的初始化。</div>
+<p>{{ HTML5ArticleTOC() }}</p>
+<p>{{ languages ( {"en": "en/WebSockets", "es": "es/WebSockets"} ) }}</p>
diff --git a/files/zh-tw/websockets/websockets_reference/closeevent/index.html b/files/zh-tw/websockets/websockets_reference/closeevent/index.html
new file mode 100644
index 0000000000..0a6d0977ff
--- /dev/null
+++ b/files/zh-tw/websockets/websockets_reference/closeevent/index.html
@@ -0,0 +1,145 @@
+---
+title: CloseEvent
+slug: WebSockets/WebSockets_reference/CloseEvent
+tags:
+  - WebSockets
+translation_of: Web/API/CloseEvent
+---
+<p>{{ draft() }}</p>
+<p>當 WebSocket 連線關閉時，客戶端會收到一個 <code>CloseEvent</code>，由 <code>WebSocket</code> 物件 <code>onclose</code> 屬性表示的監聽器接收。</p>
+<h2 id="Attributes" name="Attributes">屬性</h2>
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td class="header">屬性</td>
+   <td class="header">形態</td>
+   <td class="header">描述</td>
+  </tr>
+  <tr>
+   <td><code>code</code></td>
+   <td><code><a href="/en/unsigned_long" title="en/unsigned long">unsigned long</a></code></td>
+   <td>WebSocket 伺服器給予的連線關閉代碼。「狀態代碼」列有所有可能值。</td>
+  </tr>
+  <tr>
+   <td><code>reason</code></td>
+   <td>{{ domxref("DOMString") }}</td>
+   <td>表示伺服器關閉連線的原因，這因不同的伺服器與子協定而定。</td>
+  </tr>
+  <tr>
+   <td><code>wasClean</code></td>
+   <td><code>boolean</code></td>
+   <td>表示連線關閉情況是否乾淨。</td>
+  </tr>
+ </tbody>
+</table>
+<h2 id="狀態代碼">狀態代碼</h2>
+<p>以下列有所有合法的狀態代碼。</p>
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td class="header">狀態代碼</td>
+   <td class="header">描述</td>
+  </tr>
+  <tr>
+   <td>0-999</td>
+   <td><strong>尚未使用的保留值。</strong></td>
+  </tr>
+  <tr>
+   <td>1000</td>
+   <td>正常關閉，連線成功地達到建立時的目標。</td>
+  </tr>
+  <tr>
+   <td>1001</td>
+   <td>端點去離，伺服器故障或是瀏覽器從開啟連線的頁面離去的情形。</td>
+  </tr>
+  <tr>
+   <td>1002</td>
+   <td>因協定錯誤造成連線被端點消滅。</td>
+  </tr>
+  <tr>
+   <td>1003</td>
+   <td>因端點接收不能處理的資料形態（舉例來說，文字端點收到二進制資料）而消滅連線。</td>
+  </tr>
+  <tr>
+   <td>1004</td>
+   <td>端點收到過大的資料幀而消滅連線。</td>
+  </tr>
+  <tr>
+   <td>1005</td>
+   <td><strong>保留值。</strong>表示意外地未給予狀態代碼的情形。</td>
+  </tr>
+  <tr>
+   <td>1006</td>
+   <td><strong>保留值。</strong>用以表示在預期收到狀態代碼的情形下不正常（即未送關閉幀）的連線關閉。</td>
+  </tr>
+  <tr>
+   <td>1007-1999</td>
+   <td><strong>保留以作為未來的 WebSocket 標準之用。</strong></td>
+  </tr>
+  <tr>
+   <td>2000-2999</td>
+   <td><strong>保留以作為 WebSocket 擴展之用。</strong></td>
+  </tr>
+  <tr>
+   <td>3000-3999</td>
+   <td>程式庫與框架使用的值，應用程式<strong>可不</strong>使用。</td>
+  </tr>
+  <tr>
+   <td>4000-4999</td>
+   <td>應用程式使用的值。</td>
+  </tr>
+ </tbody>
+</table>
+<h2 id="參見">參見</h2>
+<ul>
+ <li><a href="/zh_tw/WebSockets/WebSockets_reference/WebSocket" title="zh tw/WebSockets/WebSockets reference/WebSocket"><code>WebSocket</code></a></li>
+</ul>
+<h2 id="瀏覽器兼容">瀏覽器兼容</h2>
+<p>{{ CompatibilityTable() }}</p>
+<div id="compat-desktop">
+ <table class="compat-table">
+  <tbody>
+   <tr>
+    <th>功能</th>
+    <th>Chrome</th>
+    <th>Firefox (Gecko)</th>
+    <th>Internet Explorer</th>
+    <th>Opera</th>
+    <th>Safari</th>
+   </tr>
+   <tr>
+    <td>基本支援</td>
+    <td>{{ CompatUnknown() }}</td>
+    <td>{{ CompatNo() }}</td>
+    <td>{{ CompatUnknown() }}</td>
+    <td>{{ CompatUnknown() }}</td>
+    <td>{{ CompatUnknown() }}</td>
+   </tr>
+  </tbody>
+ </table>
+</div>
+<div id="compat-mobile">
+ <table class="compat-table">
+  <tbody>
+   <tr>
+    <th>功能</th>
+    <th>Android</th>
+    <th>Firefox Mobile (Gecko)</th>
+    <th>IE Mobile</th>
+    <th>Opera Mobile</th>
+    <th>Safari Mobile</th>
+   </tr>
+   <tr>
+    <td>基本支援</td>
+    <td>{{ CompatUnknown() }}</td>
+    <td>{{ CompatNo() }}</td>
+    <td>{{ CompatUnknown() }}</td>
+    <td>{{ CompatUnknown() }}</td>
+    <td>{{ CompatUnknown() }}</td>
+   </tr>
+  </tbody>
+ </table>
+</div>
+<h3 id="Gecko_備註">Gecko 備註</h3>
+<p>此時此刻，Gecko 送至監聽器的 "close" 事件僅是簡單事件。</p>
+<p>{{ languages ( {"en": "en/WebSockets/WebSockets_reference/CloseEvent"} ) }}</p>
diff --git a/files/zh-tw/websockets/websockets_reference/index.html b/files/zh-tw/websockets/websockets_reference/index.html
new file mode 100644
index 0000000000..19621bc3b2
--- /dev/null
+++ b/files/zh-tw/websockets/websockets_reference/index.html
@@ -0,0 +1,25 @@
+---
+title: WebSockets 參考
+slug: WebSockets/WebSockets_reference
+tags:
+  - WebSockets
+translation_of: Web/API/WebSockets_API
+---
+<p>{{ draft() }}</p>
+<p>下述文章是 WebSocket API 各介面的說明文件，本頁面為暫時的佔位文件。</p>
+<dl>
+ <dt>
+  <a href="/zh_tw/WebSockets/WebSockets_reference/WebSocket" title="zh tw/WebSockets/WebSockets reference/WebSocket"><code>WebSocket</code></a></dt>
+ <dd>
+  與 WebSocket 伺服器連接，傳送、接收資料的主介面。.</dd>
+ <dt>
+  <a href="/zh_tw/WebSockets/WebSockets_reference/CloseEvent" title="zh tw/WebSockets/WebSockets reference/CloseEvent"><code>CloseEvent</code></a></dt>
+ <dd>
+  當連線關閉時 WebSocket 物件送出的事件。</dd>
+ <dt>
+  <a href="/zh_tw/WebSockets/WebSockets_reference/MessageEvent" title="zh tw/WebSockets/WebSockets reference/MessageEvent"><code>MessageEvent</code></a></dt>
+ <dd>
+  當伺服器傳來資料時 WebSocket 物送送出的事件。</dd>
+</dl>
+<p> </p>
+<p>{{ languages ( {"en": "en/WebSockets/WebSockets_reference"} ) }}</p>
diff --git a/files/zh-tw/websockets/websockets_reference/messageevent/index.html b/files/zh-tw/websockets/websockets_reference/messageevent/index.html
new file mode 100644
index 0000000000..f5c0212f78
--- /dev/null
+++ b/files/zh-tw/websockets/websockets_reference/messageevent/index.html
@@ -0,0 +1,80 @@
+---
+title: MessageEvent
+slug: WebSockets/WebSockets_reference/MessageEvent
+tags:
+  - WebSockets
+translation_of: Web/API/MessageEvent
+---
+<p>{{ draft() }}</p>
+<p>當伺服器傳來資料時，客戶端會收到一個 <code>MessageEvent</code>，由 <code>WebSocket</code> 物件 <code>onmessage</code> 表示的監聽器接收。</p>
+<h2 id="Attributes" name="Attributes">屬性</h2>
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td class="header">屬性</td>
+   <td class="header">形態</td>
+   <td class="header">描述</td>
+  </tr>
+  <tr>
+   <td><code>data</code></td>
+   <td>{{ domxref("DOMString") }} | {{ domxref("Blob") }} | <a href="/zh_tw/JavaScript_typed_arrays/ArrayBuffer" title="zh tw/JavaScript typed arrays/ArrayBuffer"><code>ArrayBuffer</code></a></td>
+   <td>伺服器傳來的資料。</td>
+  </tr>
+ </tbody>
+</table>
+<h2 id="參見">參見</h2>
+<ul>
+ <li><a href="/zh_tw/WebSockets/WebSockets_reference/WebSocket" title="zh tw/WebSockets/WebSockets reference/WebSocket"><code>WebSocket</code></a></li>
+</ul>
+<h2 id="瀏覽器兼容">瀏覽器兼容</h2>
+<p>{{ CompatibilityTable() }}</p>
+<div id="compat-desktop">
+ <table class="compat-table">
+  <tbody>
+   <tr>
+    <th>功能</th>
+    <th>Chrome</th>
+    <th>Firefox (Gecko)</th>
+    <th>Internet Explorer</th>
+    <th>Opera</th>
+    <th>Safari</th>
+   </tr>
+   <tr>
+    <td>基本支援</td>
+    <td>{{ CompatUnknown() }}</td>
+    <td>{{ CompatGeckoDesktop("2.0") }}</td>
+    <td>{{ CompatUnknown() }}</td>
+    <td>{{ CompatUnknown() }}</td>
+    <td>{{ CompatUnknown() }}</td>
+   </tr>
+  </tbody>
+ </table>
+</div>
+<div id="compat-mobile">
+ <table class="compat-table">
+  <tbody>
+   <tr>
+    <th>Feature</th>
+    <th>Android</th>
+    <th>Firefox Mobile (Gecko)</th>
+    <th>IE Mobile</th>
+    <th>Opera Mobile</th>
+    <th>Safari Mobile</th>
+   </tr>
+   <tr>
+    <td>基本支援</td>
+    <td>{{ CompatUnknown() }}</td>
+    <td>{{ CompatUnknown() }}</td>
+    <td>{{ CompatUnknown() }}</td>
+    <td>{{ CompatUnknown() }}</td>
+    <td>{{ CompatUnknown() }}</td>
+   </tr>
+  </tbody>
+ </table>
+</div>
+<h3 id="Gecko_備註">Gecko 備註</h3>
+<div class="geckoVersionNote">
+ <p>{{ gecko_callout_heading("6.0") }}</p>
+ <p>此時此刻，Gecko 不支援 <code><a href="/en/JavaScript_typed_arrays/ArrayBuffer" title="en/JavaScript typed arrays/ArrayBuffer">ArrayBuffer</a></code> 或 {{ domxref("Blob") }} 作為 <code>data</code>。</p>
+</div>
+<p>{{ languages ( {"en": "en/WebSockets/WebSockets_reference/MessageEvent"} ) }}</p>
diff --git a/files/zh-tw/websockets/websockets_reference/websocket/index.html b/files/zh-tw/websockets/websockets_reference/websocket/index.html
new file mode 100644
index 0000000000..8acd8d03d5
--- /dev/null
+++ b/files/zh-tw/websockets/websockets_reference/websocket/index.html
@@ -0,0 +1,276 @@
+---
+title: WebSocket
+slug: WebSockets/WebSockets_reference/WebSocket
+tags:
+  - WebSockets
+translation_of: Web/API/WebSocket
+---
+<p>{{ SeeCompatTable() }}</p>
+
+<p>{{ draft() }}</p>
+
+<p><code>WebSocket</code> 物件提供了建立、管理 <a href="/zh_tw/WebSockets" title="zh tw/WebSockets">WebSocket</a> 伺服器連線的 API，它也有在連線中傳送、接收資料的能力。</p>
+
+<h2 id="Method_overview" name="Method_overview">方法一覽</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td><code>void <a href="#close()">close</a>(in optional unsigned long code, in optional DOMString reason);</code></td>
+  </tr>
+  <tr>
+   <td><code>void <a href="#send()">send</a>(in DOMString data);</code></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Attributes" name="Attributes">屬性</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td class="header">屬性</td>
+   <td class="header">形態</td>
+   <td class="header">描述</td>
+  </tr>
+  <tr>
+   <td><code>binaryType</code></td>
+   <td>{{ DOMXref("DOMString") }}</td>
+   <td>表示連線傳輸的二進制資料形態的字串，若使用 {{ domxref("Blob") }} 物件則為 "blob"，使用 <a href="/zh_tw/JavaScript_typed_arrays/ArrayBuffer" title="zh tw/JavaScript typed arrays/ArrayBuffer"><code>ArrayBuffer</code></a> 物件則為 "arraybuffer"。</td>
+  </tr>
+  <tr>
+   <td><code>bufferedAmount</code></td>
+   <td><code><a href="/en/unsigned_long" title="en/unsigned long">unsigned long</a></code></td>
+   <td>呼叫 {{ manch("send") }} 隊列但尚未傳輸至網路上資料的位元數。連線關閉時此值不會重設為零。連續呼叫 {{ manch("send") }} 會讓此值不斷上升。<strong>唯讀</strong></td>
+  </tr>
+  <tr>
+   <td><code>extensions</code></td>
+   <td>{{ DOMXref("DOMString") }}</td>
+   <td>伺服器選擇的擴展。目前僅有空字串或表示資料經過壓縮的 "deflate-stream"。<strong>唯讀</strong></td>
+  </tr>
+  <tr>
+   <td><code>onclose</code></td>
+   <td>{{ domxref("EventListener") }}</td>
+   <td>當 WebSocket 連線的 <code>readyState</code> 切換至 <code>CLOSED</code> 時呼叫的事件監聽器。監聽器接收命名為 "close" 的 <a href="/zh_tw/WebSockets/WebSockets_reference/CloseEvent" title="zh tw/WebSockets/WebSockets reference/CloseEvent"><code>CloseEvent</code></a>。</td>
+  </tr>
+  <tr>
+   <td><code>onerror</code></td>
+   <td>{{ domxref("EventListener") }}</td>
+   <td>當錯誤發生時呼叫的事件監聽器。事件為命名 "error" 的簡單事件。</td>
+  </tr>
+  <tr>
+   <td><code>onmessage</code></td>
+   <td>{{ domxref("EventListener") }}</td>
+   <td>當瀏覽器接收伺服器的訊息時呼叫的事件監聽器。監聽器接收命名為 "message" 的 <a href="/zh_tw/WebSockets/WebSockets_reference/MessageEvent" title="zh tw/WebSockets/WebSockets reference/MessageEvent"><code>MessageEvent</code></a>。</td>
+  </tr>
+  <tr>
+   <td><code>onopen</code></td>
+   <td>{{ domxref("EventListener") }}</td>
+   <td>當 WebSocket 連線的 <code>readyState</code> 切換至 <code>OPEN</code> 時呼叫的事件監聽器，表示連線已準備傳送、接收資料。事件為命名 "open" 的簡單事件。</td>
+  </tr>
+  <tr>
+   <td><code>protocol</code></td>
+   <td>{{ DOMXref("DOMString") }}</td>
+   <td>伺服器選擇的子協定，這是建立 WebSocket 物件時 <code>protocols</code> 參數裡的其中一個字串。</td>
+  </tr>
+  <tr>
+   <td><code>readyState</code></td>
+   <td><code><a href="/en/unsigned_short" title="en/unsigned short">unsigned short</a></code></td>
+   <td>連線的目前狀態，是就緒狀態常數的其中一個。<strong>唯讀</strong></td>
+  </tr>
+  <tr>
+   <td><code>url</code></td>
+   <td>{{ DOMXref("DOMString") }}</td>
+   <td>建構方法解析出來的 URL，總是絕對 URL。<strong>唯讀</strong></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Constants" name="Constants">常數</h2>
+
+<h3 id="就緒狀態常數">就緒狀態常數</h3>
+
+<p><code>readyState</code> 屬性使用以下常數描述 WebSocket 的連線狀態。</p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td class="header">常數</td>
+   <td class="header">值</td>
+   <td class="header">描述</td>
+  </tr>
+  <tr>
+   <td><code>CONNECTING</code></td>
+   <td><code>0</code></td>
+   <td>連線尚未打開。</td>
+  </tr>
+  <tr>
+   <td><code>OPEN</code></td>
+   <td><code>1</code></td>
+   <td>連線已打開，可以進行通訊。</td>
+  </tr>
+  <tr>
+   <td><code>CLOSING</code></td>
+   <td><code>2</code></td>
+   <td>連線正在進行關閉程序。</td>
+  </tr>
+  <tr>
+   <td><code>CLOSED</code></td>
+   <td><code>3</code></td>
+   <td>連線已關閉／連線不能打開。</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Methods" name="Methods">方法</h2>
+
+<h3 id="close()" name="close()">close()</h3>
+
+<p>關閉 WebSocket 連線／連線嘗試，若連線已為 <code>CLOSED</code>，此方法沒有作用。</p>
+
+<pre class="eval">void close(
+  in optional unsigned short code,
+  in optional DOMString reason
+);
+</pre>
+
+<h6 id="Parameters" name="Parameters">參數</h6>
+
+<dl>
+ <dt><code>code</code> {{ optional_inline() }}</dt>
+ <dd>表示狀態代碼，狀態代碼用以解釋連線關閉的原因。若未指定參數，預設值為 1000（表示正常的「事務完結（transaction complete）」關閉）。請參考 <a href="/zh_tw/WebSockets/WebSockets_reference/CloseEvent" title="zh tw/WebSockets/WebSockets reference/CloseEvent"><code>CloseEvent</code></a> 頁面的<a href="/zh_tw/WebSockets/WebSockets_reference/CloseEvent#.e7.8b.80.e6.85.8b.e4.bb.a3.e7.a2.bc" title="zh tw/WebSockets/WebSockets reference/CloseEvent#.e7.8b.80.e6.85.8b.e4.bb.a3.e7.a2.bc">狀態代碼列表</a>，有所有的合法值。</dd>
+ <dt><code>reason</code> {{ optional_inline() }}</dt>
+ <dd>解釋連線關閉原因的人類可讀字串，字串必不可大於 123 個 UTF-8 字符。</dd>
+</dl>
+
+<h6 id="可丟例外">可丟例外</h6>
+
+<dl>
+ <dt><code>INVALID_ACCESS_ERR</code></dt>
+ <dd>指定不合法的 <code>code</code>。</dd>
+ <dt><code>SYNTAX_ERR</code></dt>
+ <dd><code>reason</code> 字串太長或是含有未配對的代理對。</dd>
+</dl>
+
+<h3 id="send()" name="send()">send()</h3>
+
+<p>透過 WebSocket 連線傳輸資料至伺服器。</p>
+
+<pre class="eval">void send(
+  in DOMString data
+);
+
+void send(
+  in ArrayBuffer data
+);
+
+void send(
+  in Blob data
+);
+</pre>
+
+<h6 id="Parameters" name="Parameters">參數</h6>
+
+<dl>
+ <dt><code>data</code></dt>
+ <dd>要傳送至伺服器的字串。</dd>
+</dl>
+
+<h6 id="可丟例外_2">可丟例外</h6>
+
+<dl>
+ <dt><code>INVALID_STATE_ERR</code></dt>
+ <dd>目前連線不為 <code>OPEN</code>。</dd>
+ <dt><code>SYNTAX_ERR</code></dt>
+ <dd>資料為帶有未配對代理對的字串。</dd>
+</dl>
+
+<h6 id="註釋">註釋</h6>
+
+<div class="geckoVersionNote">
+<p>{{ gecko_callout_heading("6.0") }}</p>
+
+<p>Gecko <code>send()</code> 方法的實作與 Gecko 6.0 的規範有差別。Gecko 回傳一個 <code>boolean</code> 以表示連線是否仍處於開啟狀態（且資料成功隊列／傳輸）。另外，此時此刻，Gecko 不支援 <code><a href="/zh_tw/JavaScript_typed_arrays/ArrayBuffer" title="zh tw/JavaScript typed arrays/ArrayBuffer">ArrayBuffer</a></code> 或 {{ domxref("Blob") }} 作為資料形態。</p>
+</div>
+
+<h2 id="See_also" name="See_also">參見</h2>
+
+<ul>
+ <li><a href="/zh_tw/WebSockets/Writing_WebSocket_client_applications" title="zh_tw/WebSockets/Writing WebSocket client applications">製作 WebSocket 客戶端應用程式</a></li>
+ <li><a class="external" href="http://dev.w3.org/html5/websockets/" title="http://dev.w3.org/html5/websockets/">HTML5: WebSockets</a></li>
+</ul>
+
+<h2 id="瀏覽器兼容">瀏覽器兼容</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>功能</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>基本支援</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatGeckoDesktop("2.0") }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+  </tr>
+  <tr>
+   <td>子協定支援</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatGeckoDesktop("6.0") }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>功能</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>基本支援</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatGeckoMobile("7.0") }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+  </tr>
+  <tr>
+   <td>子協定支援</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatGeckoMobile("7.0") }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h3 id="Gecko_備註">Gecko 備註</h3>
+
+<p>自從 Gecko 6.0，建構方法有前輟，須使用 <code>MozWebSocket()</code>：</p>
+
+<pre>var mySocket = new MozWebSocket("<span class="plain">http://www.example.com/socketserver</span>");
+</pre>
+
+<p>{{ languages ( {"en": "en/WebSockets/WebSockets_reference/WebSocket"} ) }}</p>
diff --git a/files/zh-tw/websockets/writing_websocket_client_applications/index.html b/files/zh-tw/websockets/writing_websocket_client_applications/index.html
new file mode 100644
index 0000000000..8f1299379f
--- /dev/null
+++ b/files/zh-tw/websockets/writing_websocket_client_applications/index.html
@@ -0,0 +1,179 @@
+---
+title: 製作 WebSocket 客戶端應用程式
+slug: WebSockets/Writing_WebSocket_client_applications
+tags:
+  - WebSockets
+translation_of: Web/API/WebSockets_API/Writing_WebSocket_client_applications
+---
+<p>{{ draft() }}</p>
+
+<p>WebSocket 是一種讓瀏覽器與伺服器進行一段互動通訊的技術。使用這項技術的 Webapp 可以直接進行即時通訊而不需要不斷對資料更改進行輪詢（polling）。</p>
+
+<div class="note"><strong>注：</strong>當我們的系統架構可以寄存 WebSocket 範例之後，我們會提供聊天／伺服器系統實例的幾個範例。</div>
+
+<h2 id="哪裡有_WebSocket">哪裡有 WebSocket</h2>
+
+<p>若 JavaScript 代碼的範疇是 {{ domxref("Window") }} 物件或是實作 {{ domxref("WorkerUtils") }} 的物件，則可使用 WebSocket API。也就是可以從 Web Workers 使用 WebSocket。</p>
+
+<div class="note"><strong>注：</strong>WebSockets API（與底層協定）的開發還在進展中，且目前不同瀏覽器（甚至瀏覽器的不同版本）有很多兼容問題。</div>
+
+<h2 id="建立一個_WebSocket_物件">建立一個 WebSocket 物件</h2>
+
+<p>你必須建立一個 <a href="/zh_tw/WebSockets/WebSockets_reference/WebSocket" title="zh tw/WebSockets/WebSockets reference/WebSocket"><code>WebSocket</code></a> 物件才能讓瀏覽器／伺服器得以以 WebSocket 協定進行通訊，此物件在被建立之後會自動與伺服器連線。</p>
+
+<div class="note"><strong>注：</strong>別忘記在 Firefox 6.0 中 <code>WebSocket</code> 物件仍有前輟，所以在這裡須改成 <code>MozWebSocket</code>。</div>
+
+<p>WebSocket 的建構方法有一個必要參數與一個選擇參數：</p>
+
+<pre>WebSocket WebSocket(
+  in DOMString url,
+  in optional DOMString protocols
+);
+
+WebSocket WebSocket(
+  in DOMString url,
+  in optional DOMString[] protocols
+);
+</pre>
+
+<dl>
+ <dt><code>url</code></dt>
+ <dd>連線用的 URL，WebSocket 伺服器會回應這個 URL。<br>
+ <br>
+ 根據網際網路工程任務小組（Internet Engineering Task Force，IETF）定義之規範， URL 的協議類型必須是 <code>ws://</code> （非加密連線）或是 <code>wss://</code> （加密連線）</dd>
+ <dt><code>protocols</code> {{ optional_inline() }}</dt>
+ <dd>一個表示協定的字串或者是一個表示協定的字串構成的陣列。這些字串可以用來指定子協定，因此一個伺服器可以實作多個 WebSocket 子協定（舉例來說，你可以讓一個伺服器處理不同種類的互動情形，各情形以 <code>protocol</code> 分別）。若不指定協定字串則預設值為空字串。</dd>
+</dl>
+
+<p>此建構方法可能拋出以下例外：</p>
+
+<dl>
+ <dt><code>SECURITY_ERR</code></dt>
+ <dd>連線使用的埠被阻擋。</dd>
+</dl>
+
+<h3 id="範例">範例</h3>
+
+<p>此簡單範例建立了一個新的 WebSocket，連到位於 <code><span class="nowiki">http://www.example.com/socketserver</span></code> 的伺服器。指定的子協定是 "my-custom-protocol"。</p>
+
+<pre>var mySocket = new WebSocket("<span class="plain">ws://www.example.com/socketserver</span>", "my-custom-protocol");
+</pre>
+
+<p>回傳之後，<code>mySocket</code> 的 <code>readyState</code> 會變成 <code>CONNECTING</code>。當連線已可以傳輸資料時 <code>readyState</code> 會變成 <code>OPEN</code>。</p>
+
+<p>要建立一個連線但不指定單一個特定協定，可以指定一個協定構成的陣列：</p>
+
+<pre>var mySocket = new WebSocket("<span class="plain">ws://www.example.com/socketserver</span>", ["protocol1", "protocol2"]);
+</pre>
+
+<p>當連線建立的時候（也就是 <code>readyState</code> 變成而 <code>OPEN</code> 的時候），<code>protocol</code> 屬性會回傳伺服器選擇的協定。</p>
+
+<h2 id="傳資料給伺服器">傳資料給伺服器</h2>
+
+<p>連線開啟之後即可開始傳資料給伺服器。呼叫 <code>WebSocket</code> 的 <a href="/zh_tw/WebSockets/WebSockets_reference/WebSocket#send()" title="zh tw/WebSockets/WebSockets reference/WebSocket#send()"><code>send()</code></a> 來發送訊息：</p>
+
+<pre>mySocket.send("這是伺服器正迫切需要的文字！");
+</pre>
+
+<p>可以被傳送的內容包括字串、<a href="/en/DOM/Blob" title="en/DOM/Blob"><code>Blob</code></a> 或是 <a href="/zh_tw/JavaScript_typed_arrays/ArrayBuffer" title="zh tw/JavaScript typed arrays/ArrayBuffer"><code>ArrayBuffer</code></a>。</p>
+
+<div class="note"><strong>注：</strong>Firefox 目前只支援字串傳送。</div>
+
+<h3 id="用_JSON_傳輸物件">用 JSON 傳輸物件</h3>
+
+<p>有一個很方便的方法是用 <a href="/en/JSON" title="en/JSON">JSON</a> 傳送複雜的資料給伺服器，舉例來說，聊天程式可以設計一種協定，這個協定傳送以 JSON 封裝的資料封包：</p>
+
+<pre class="brush: js">// 透過伺服器傳送文字給所有使用者
+
+function sendText() {
+  var msg = {
+    type: "message",
+    text: document.getElementById("text").value,
+    id: clientID,
+    date: Date.now()
+  };
+
+  mySocket.send(JSON.stringify(msg));
+  document.getElementById("text").value = "";
+}
+</pre>
+
+<p>這份代碼先建立一個物件：<code>msg</code>，它包含伺服器處理訊息所需的種種資訊，然後呼叫 <a href="/en/JavaScript/Reference/Global_Objects/JSON/stringify" title="en/JavaScript/Reference/Global Objects/JSON/stringify"><code>JSON.stringify()</code></a> 使該物件轉換成 JSON 格式並呼叫 WebSocket 的 <a href="/zh_tw/WebSockets/WebSockets_reference/WebSocket#send()" title="zh tw/WebSockets/WebSockets reference/WebSocket#send()"><code>send()</code></a> 方法來傳輸資料至伺服器。</p>
+
+<h2 id="從伺服器接收訊息">從伺服器接收訊息</h2>
+
+<p>WebSockets 是一個事件驅動 API，當瀏覽器收到訊息時，一個「message」事件被傳入 <code>onmessage</code> 函數。使用以下方法開始傾聽傳入資料：</p>
+
+<pre class="brush: js">mySocket.onmessage = function(e) {
+  console.log(e.data);
+}
+</pre>
+
+<h3 id="接收並解讀_JSON_物件">接收並解讀 JSON 物件</h3>
+
+<p>考慮先前在「用 JSON 傳輸物件」談起的聊天應用程式。客戶端可能收到的資料封包有幾種：</p>
+
+<ul>
+ <li>登入握手</li>
+ <li>訊息文字</li>
+ <li>更新使用者清單</li>
+</ul>
+
+<p>用來解讀傳入訊息的代碼可能像是：</p>
+
+<pre class="brush: js">connection.onmessage = function(evt) {
+  var f = document.getElementById("chatbox").contentDocument;
+  var text = "";
+  var msg = JSON.parse(evt.data);
+  var time = new Date(msg.date);
+  var timeStr = time.toLocaleTimeString();
+
+  switch(msg.type) {
+    case "id":
+      clientID = msg.id;
+      setUsername();
+      break;
+    case "username":
+      text = "&lt;b&gt;使用者 &lt;em&gt;" + msg.name + "&lt;/em&gt; 登入於 " + timeStr + "&lt;/b&gt;&lt;br&gt;";
+      break;
+    case "message":
+      text = "(" + timeStr + ") &lt;b&gt;" + msg.name + "&lt;/b&gt;: " + msg.text + "&lt;br&gt;";
+      break;
+    case "rejectusername":
+      text = "&lt;b&gt;由於你選取的名字已被人使用，你的使用者名稱已被設置為 &lt;em&gt;" + msg.name + "&lt;/em&gt;。";
+      break;
+    case "userlist":
+      var ul = "";
+      for (i=0; i &lt; msg.users.length; i++) {
+        ul += msg.users[i] + "&lt;br&gt;";
+      }
+      document.getElementById("userlistbox").innerHTML = ul;
+      break;
+  }
+
+  if (text.length) {
+    f.write(text);
+    document.getElementById("chatbox").contentWindow.scrollByPages(1);
+  }
+};
+</pre>
+
+<p>這裡我們使用 <a href="/en/JavaScript/Reference/Global_Objects/JSON/parse" title="en/JavaScript/Reference/Global Objects/JSON/parse"><code>JSON.parse()</code></a> 使 JSON 物件轉換成原來的物件，檢驗並根據內容採取行動。</p>
+
+<h2 id="關閉連線">關閉連線</h2>
+
+<p>當你想結束 WebSocket 連線的時候，呼叫 WebSocket 的 <a href="/zh_tw/WebSockets/WebSockets_reference/WebSocket#close()" title="zh tw/WebSockets/WebSockets reference/WebSocket#close()"><code>close()</code></a> 方法：</p>
+
+<pre>mySocket.close();
+</pre>
+
+<h2 id="參考資料">參考資料</h2>
+
+<p><a href="https://tools.ietf.org/html/draft-abarth-thewebsocketprotocol-01">IETF: The WebSocket protocol draft-abarth-thewebsocketprotocol-01</a></p>
+
+<p> </p>
+
+<p>{{ languages ( {"en": "en/WebSockets/Writing_WebSocket_client_applications"} ) }}</p>
+
+<dl>
+</dl>