aboutsummaryrefslogtreecommitdiff
path: root/files/zh-cn/web/api/websocket/index.html
blob: dc534d928aa33ab0934954b0442798f6cf21ffd6 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
---
title: WebSocket
slug: Web/API/WebSocket
tags:
  - API
  - WebSocket
  - WebSockets
translation_of: Web/API/WebSocket
---
<div>{{APIRef("Web Sockets API")}}</div>

<p><code>WebSocket</code> 对象提供了用于创建和管理 <a href="/zh-CN/docs/Web/API/WebSockets_API" title="zh-CN/WebSockets">WebSocket</a> 连接,以及可以通过该连接发送和接收数据的 API。</p>

<p>使用<code><a href="/en-US/docs/Web/API/WebSocket/WebSocket"> WebSocket()</a></code><a href="/en-US/docs/Web/API/WebSocket/WebSocket"> </a>构造函数来构造一个<code> WebSocket</code></p>

<h2 id="构造函数">构造函数</h2>

<dl>
 <dt>{{domxref("WebSocket.WebSocket", "WebSocket(url[, protocols])")}}</dt>
 <dd>返回一个 <code>WebSocket</code> 对象。</dd>
</dl>

<h2 id="常量">常量</h2>

<table class="standard-table">
 <tbody>
  <tr>
   <td><strong>Constant</strong></td>
   <td><strong>Value</strong></td>
  </tr>
  <tr>
   <td><code>WebSocket.CONNECTING</code></td>
   <td><code>0</code></td>
  </tr>
  <tr>
   <td><code>WebSocket.OPEN</code></td>
   <td><code>1</code></td>
  </tr>
  <tr>
   <td><code>WebSocket.CLOSING</code></td>
   <td><code>2</code></td>
  </tr>
  <tr>
   <td><code>WebSocket.CLOSED</code></td>
   <td><code>3</code></td>
  </tr>
 </tbody>
</table>

<h2 id="属性">属性</h2>

<dl>
 <dt>{{domxref("WebSocket.binaryType")}}</dt>
 <dd>使用二进制的数据类型连接。</dd>
 <dt>{{domxref("WebSocket.bufferedAmount")}} {{readonlyinline}}</dt>
 <dd>未发送至服务器的字节数。</dd>
</dl>

<dl>
 <dt>{{domxref("WebSocket.extensions")}} {{readonlyinline}}</dt>
 <dd>服务器选择的扩展。</dd>
</dl>

<dl>
 <dt>{{domxref("WebSocket.onclose")}}</dt>
 <dd>用于指定连接关闭后的回调函数。</dd>
 <dt>{{domxref("WebSocket.onerror")}}</dt>
 <dd>用于指定连接失败后的回调函数。</dd>
 <dt>{{domxref("WebSocket.onmessage")}}</dt>
 <dd>用于指定当从服务器接受到信息时的回调函数。</dd>
 <dt>{{domxref("WebSocket.onopen")}}</dt>
 <dd>用于指定连接成功后的回调函数。</dd>
 <dt>{{domxref("WebSocket.protocol")}} {{readonlyinline}}</dt>
 <dd>服务器选择的下属协议。</dd>
 <dt>{{domxref("WebSocket.readyState")}} {{readonlyinline}}</dt>
 <dd>当前的链接状态。</dd>
 <dt>{{domxref("WebSocket.url")}} {{readonlyinline}}</dt>
 <dd>WebSocket 的绝对路径。</dd>
</dl>

<h2 id="Method_overview" name="Method_overview">方法</h2>

<dl>
 <dt>{{domxref("WebSocket.close", "WebSocket.close([code[, reason]])")}}</dt>
 <dd>关闭当前链接。</dd>
 <dt>{{domxref("WebSocket.send", "WebSocket.send(data)")}}</dt>
 <dd><span>对要传输的数据进行排队</span></dd>
</dl>

<h2 id="事件">事件</h2>

<p>使用 <code>addEventListener()</code> 或将一个事件监听器赋值给本接口的 <code>on<em>eventname</em></code> 属性,来监听下面的事件。</p>

<dl>
 <dt>{{domxref("WebSocket/close_event", "close")}}</dt>
 <dd>当一个 <code>WebSocket</code> 连接被关闭时触发。<br>
 也可以通过 {{domxref("WebSocket/onclose", "onclose")}} 属性来设置。</dd>
 <dt>{{domxref("WebSocket/error_event", "error")}}</dt>
 <dd>当一个 <code>WebSocket</code> 连接因错误而关闭时触发,例如无法发送数据时。<br>
 也可以通过 {{domxref("WebSocket/onerror", "onerror")}} 属性来设置.</dd>
 <dt>{{domxref("WebSocket/message_event", "message")}}</dt>
 <dd>当通过 <code>WebSocket</code> 收到数据时触发。<br>
 也可以通过 {{domxref("WebSocket/onmessage", "onmessage")}} 属性来设置。</dd>
 <dt>{{domxref("WebSocket/open_event", "open")}}</dt>
 <dd>当一个 <code>WebSocket</code> 连接成功时触发。<br>
 也可以通过 {{domxref("WebSocket/onopen", "onopen")}} 属性来设置。</dd>
</dl>

<h2 id="Attributes" name="Attributes">示例</h2>

<pre class="brush: js line-numbers language-js">// Create WebSocket connection.
const socket = new WebSocket('ws://localhost:8080');

// Connection opened
socket.addEventListener('open', function (event) {
    socket.send('Hello Server!');
});

// Listen for messages
socket.addEventListener('message', function (event) {
    console.log('Message from server ', event.data);
});
</pre>

<h2 id="规范">规范</h2>

<table class="standard-table">
 <tbody>
  <tr>
   <td>规范</td>
   <td>状态</td>
   <td>注释</td>
  </tr>
  <tr>
   <td>{{SpecName("HTML WHATWG", "web-sockets.html#the-websocket-interface", "WebSocket")}}</td>
   <td>{{Spec2("HTML WHATWG")}}</td>
   <td>初始定义</td>
  </tr>
 </tbody>
</table>

<ul>
</ul>

<h2 id="浏览器兼容性">浏览器兼容性</h2>

<p>{{Compat("api.WebSocket")}}</p>

<h2 id="See_also" name="See_also">相关链接</h2>

<ul>
 <li><a href="/zh-CN/docs/Web/API/WebSockets_API/Writing_WebSocket_client_applications" title="/zh-CN/docs/Web/API/WebSockets_API/Writing_WebSocket_client_applications">Writing WebSocket client applications</a></li>
</ul>

<p>
 <audio style="display: none;"></audio>
</p>