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
|
---
title: WebSocket
slug: Web/API/WebSocket
tags:
- API
- Interface
- NeedsContent
- WebSocket
- WebSockets
- インターフェイス
translation_of: Web/API/WebSocket
---
<div>{{APIRef("Web Sockets API")}}</div>
<p><code>WebSocket</code> オブジェクトは、サーバーへの <a href="/ja/docs/Web/API/WebSockets_API">WebSocket</a> 接続の作成と管理、および接続上のデータの送受信に使用する API を提供します。</p>
<p><code>WebSocket</code> を構築するには、 <code><a href="/ja/docs/Web/API/WebSocket/WebSocket">WebSocket()</a></code> コンストラクターを使用してください。</p>
<h2 id="Constructor" name="Constructor">コンストラクター</h2>
<dl>
<dt>{{domxref("WebSocket.WebSocket", "WebSocket(url[, protocols])")}}</dt>
<dd>新しく作成された <code>WebSocket</code> オブジェクトを返します。</dd>
</dl>
<h2 id="Constants" name="Constants">定数</h2>
<table class="standard-table">
<tbody>
<tr>
<td class="header">定数</td>
<td class="header">値</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="Properties" name="Properties">プロパティ</h2>
<dl>
<dt>{{domxref("WebSocket.binaryType")}}</dt>
<dd>接続で使用されるバイナリデータ型。</dd>
<dt>{{domxref("WebSocket.bufferedAmount")}} {{readonlyinline}}</dt>
<dd>キューに入れられたデータのバイト数。</dd>
<dt>{{domxref("WebSocket.extensions")}} {{readonlyinline}}</dt>
<dd>サーバーによって選択された拡張機能。</dd>
<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 の絶対 URL。</dd>
</dl>
<h2 id="Methods" name="Methods">メソッド</h2>
<dl>
<dt>{{domxref("WebSocket.close", "WebSocket.close([code[, reason]])")}}</dt>
<dd>接続を閉じます。</dd>
<dt>{{domxref("WebSocket.send", "WebSocket.send(data)")}}</dt>
<dd>送信するデータをキューに入れます。</dd>
</dl>
<h2 id="Events" name="Events">イベント</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="Examples" name="Examples">例</h2>
<pre class="brush: js notranslate">// WebSocket 接続を作成
const socket = new WebSocket('ws://localhost:8080');
// 接続が開いたときのイベント
socket.addEventListener('open', function (event) {
socket.send('Hello Server!');
});
// メッセージの待ち受け
socket.addEventListener('message', function (event) {
console.log('Message from server ', event.data);
});</pre>
<h2 id="Specifications" name="Specifications">仕様書</h2>
<table class="standard-table">
<thead>
<tr>
<th scope="col">仕様書</th>
<th scope="col">状態</th>
</tr>
</thead>
<tbody>
<tr>
<td>{{SpecName("HTML WHATWG", "#network", "WebSocket")}}</td>
<td>{{Spec2("HTML WHATWG")}}</td>
</tr>
</tbody>
</table>
<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>
<div>
<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div>
<p>{{Compat("api.WebSocket")}}</p>
</div>
<h2 id="See_also" name="See_also">関連情報</h2>
<ul>
<li><a href="/ja/docs/Web/API/WebSockets_API/Writing_WebSocket_client_applications">WebSocket クライアントアプリケーションを書く</a></li>
</ul>
|
