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
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
|
---
title: Escrever um servidor WebSocket em C#
slug: Web/API/WebSockets_API/Writing_WebSocket_server
tags:
- HTML5
- Tutorial
- WebSockets
translation_of: Web/API/WebSockets_API/Writing_WebSocket_server
original_slug: Web/API/WebSockets_API/Escrever_um_servidor_WebSocket_em_C
---
<h2 id="Introdução">Introdução</h2>
<p>Se desejar utilizar o WebSocket API, é útil dispor de um servidor. Neste artigo pode ver como escrever um em C#. Pode fazê-lo em qualquer língua do lado do servidor, mas para manter as coisas simples e mais compreensíveis, vamos usar a linguagem da Microsoft.</p>
<p>Este servidor está em conformidade com o <a href="http://tools.ietf.org/html/rfc6455">RFC 6455</a>, pelo que só tratará de ligações a partir das versões de navegadores; Chrome 16, Firefox 11, e IE 10 ou superior.</p>
<h2 id="Primeiros_passos">Primeiros passos</h2>
<p>Os WebSockets comunicam através de uma ligação interwiki("wikipedia","Transmission_Control_Protocol","TCP (Transmission Control Protocol)"). Felizmente, C# tem uma classe TcpListener que serve para escutar ligações de TCP. Encontra-se no espaço de nomes <code>System.Net.Sockets</code>.</p>
<div class="note">
<p><span style="line-height: 1.572;"><strong>Nota:</strong> É aconselhável incluir o namespace com <code>using</code> a fim de escrever menos. Permite a utilização das classes de um namespace sem escrever sempre o namespace completo.</span></p>
</div>
<h3 id="TcpListener">TcpListener</h3>
<h4 id="Construtor">Construtor</h4>
<dl>
<dt><code>TcpListener(System.Net.IPAddress localaddr, int port)</code></dt>
<dd><code>localaddr</code> indica o endereço IP do ouvinte e <code>port</code> indica a porta.</dd>
</dl>
<div class="note">
<p><span style="line-height: 1.572;"><strong>Nota:</strong> Para criar um objeto <code>IPAddress</code> a partir de uma <code>string</code>, use o método <em>static</em> </span><code>Parse</code><span style="line-height: 1.572;"> de </span><code>IPAddress</code><em>.</em></p>
</div>
<h4 id="Métodos"><span style="line-height: 1.572;">Métodos</span></h4>
<dl>
<dt><code><span style="line-height: 1.572;">Start()</span></code></dt>
<dd>Começa a escutar os pedidos de ligação recebidos.</dd>
</dl>
<dl>
<dt><code><span style="line-height: 1.572;">AcceptTcpClient()</span></code></dt>
<dd>Espera por uma ligação TCP, aceita-a e devolve-a como um objeto <a href="https://docs.microsoft.com/pt-pt/dotnet/api/system.net.sockets.tcpclient">TcpClient</a>.</dd>
</dl>
<h4 class="syntaxbox" id="Exemplo">Exemplo</h4>
<p><span style="line-height: 1.572;">Aqui tem uma implementação básica do servidor:</span></p>
<pre class="brush: cpp notranslate">using System.Net.Sockets;
using System.Net;
using System;
class Server {
public static void Main() {
TcpListener server = new TcpListener(IPAddress.Parse("127.0.0.1"), 80);
server.Start();
Console.WriteLine("O servidor começou com endreço 127.0.0.1:80.{0}Esperando por uma conexão...", Environment.NewLine);
TcpClient client = server.AcceptTcpClient();
Console.WriteLine("Um cliente está conectado.");
}
}
</pre>
<h3 id="TcpClient"><span style="line-height: 1.572;">TcpClient</span></h3>
<h4 id="Métodos_2">Métodos</h4>
<dl>
<dt><code>GetStream()</code></dt>
<dd>Obtém o <em>stream</em> que é o canal de comunicação. Ambos os lados do canal têm capacidade de leitura e escrita.</dd>
</dl>
<h4 id="Propriedades">Propriedades</h4>
<dl>
<dt><code>int Available</code></dt>
<dd>Esta propriedade indica quantos bytes de dados foram enviados. O valor é zero até que a propriedade <code>NetworkStream.DataAvailable</code> seja <code>true</code>.</dd>
</dl>
<h3 id="NetworkStream">NetworkStream</h3>
<h4 id="Métodos_3">Métodos</h4>
<dl>
<dt><code>Write(Byte[] buffer, int offset, int size)</code></dt>
<dd>Escreve bytes vindos do <code>buffer</code>. <code>offset</code> e <code>size</code> determinam o comprimento da mensagem.</dd>
<dt><code><span class="brush: cpp" style="line-height: 1.572;">Read(Byte[] buffer, int offset, int size)</span></code></dt>
<dd><span class="brush: cpp" style="line-height: 1.572;">Lê bytes do <code>buffer</code>. <code>offset</code> e <code>size</code> </span>determinam o comprimento da mensagem<span class="brush: cpp" style="line-height: 1.572;">.</span></dd>
</dl>
<h4 id="Exemplo_2">Exemplo</h4>
<p>Vamos continuar o nosso exemplo:</p>
<pre class="brush: cpp notranslate">TcpClient client = server.AcceptTcpClient();
Console.WriteLine("Um cliente está conectado.");
NetworkStream stream = client.GetStream();
// entrar num ciclo infinito para poder processar qualquer mudança no stream
while (true) {
while (!stream.DataAvailable);
Byte[] bytes = new Byte[client.Available];
stream.Read(bytes, 0, bytes.Length);
}</pre>
<h2 id="Handshaking_aperto_de_mão"><em>Handshaking </em>(aperto de mão)</h2>
<p>Quando um cliente se liga a um servidor, envia um pedido GET para atualizar a ligação do protocolo HTTP a uma ligação WebSocket. Isto é conhecido como aperto de mão.</p>
<p>Este código de amostra pode detetar um GET do cliente. Note que isto irá bloquear até que os primeiros 3 bytes de uma mensagem estejam disponíveis. Deverão ser investigadas soluções alternativas para ambientes de produção.</p>
<pre class="brush: cpp notranslate">using System.Text;
using System.Text.RegularExpressions;
while(client.Available < 3)
{
// esperar para que hajam bytes suficientes disponiveis
}
Byte[] bytes = new Byte[client.Available];
stream.Read(bytes, 0, bytes.Length);
//traduzir bytes do pedido para uma string
String data = Encoding.UTF8.GetString(bytes);
if (Regex.IsMatch(data, "^GET")) {
} else {
}</pre>
<p>A resposta é fácil de construir, mas pode ser um pouco difícil de compreender. A explicação completa do aperto de mão do servidor pode ser encontrada em <a href="https://tools.ietf.org/html/rfc6455#section-4.2.2">RFC 6455, secção 4.2.2</a>. Para os nossos propósitos, vamos apenas construir uma resposta simples.</p>
<p>Deve:</p>
<ol>
<li>Obter o valor do cabeçalho de pedido da <code>Sec-WebSocket-Key</code> sem qualquer espaço em branco</li>
<li>Combine esse valor com "258EAFA5-E914-47DA-95CA-C5AB0DC85B11" (um GUID especificado pela RFC 6455)</li>
<li>Calcule o código SHA-1 e Base64 do mesmo</li>
<li>Devolve-o como o valor do cabeçalho de resposta Sec-WebSocket-Accept numa resposta HTTP.</li>
</ol>
<pre class="brush: cpp notranslate"><em>
</em>if (new System.Text.RegularExpressions.Regex("^GET").IsMatch(data))
{
const string eol = "\r\n"; // HTTP/1.1 define a sequencia "CR LF" como o marcador de fim de linha
Byte[] response = Encoding.UTF8.GetBytes("HTTP/1.1 101 Switching Protocols" + eol
+ "Connection: Upgrade" + eol
+ "Upgrade: websocket" + eol
+ "Sec-WebSocket-Accept: " + Convert.ToBase64String(
System.Security.Cryptography.SHA1.Create().ComputeHash(
Encoding.UTF8.GetBytes(
new System.Text.RegularExpressions.Regex("Sec-WebSocket-Key: (.*)").Match(data).Groups[1].Value.Trim() + "258EAFA5-E914-47DA-95CA-C5AB0DC85B11"
)
)
) + eol
+ eol);
stream.Write(response, 0, response.Length);
}
</pre>
<h2 id="Descodificar_mensagens">Descodificar mensagens</h2>
<p>Após um aperto de mão bem-sucedido, o cliente pode enviar mensagens para o servidor, mas agora estas estão codificadas.</p>
<p>Se enviarmos "MDN", recebemos estes bytes:</p>
<table>
<tbody>
<tr>
<td>129</td>
<td>131</td>
<td>61</td>
<td>84</td>
<td>35</td>
<td>6</td>
<td>112</td>
<td>16</td>
<td>109</td>
</tr>
</tbody>
</table>
<p>Vejamos o que significam estes bytes.</p>
<p>O primeiro byte, que tem actualmente um valor de 129, é um bitfield que se decompõe da seguinte forma:</p>
<table>
<thead>
<tr>
<th scope="col">FIN (Bit 0)</th>
<th scope="col">RSV1 (Bit 1)</th>
<th scope="col">RSV2 (Bit 2)</th>
<th scope="col">RSV3 (Bit 3)</th>
<th scope="col">Opcode (Bit 4:7)</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0x1=0001</td>
</tr>
</tbody>
</table>
<ul>
<li>FIN bit: Este bit indica se a mensagem completa foi enviada pelo cliente. As mensagens podem ser enviadas em <em>frames</em>, mas por agora vamos manter as coisas simples.</li>
<li>RSV1, RSV2, RSV3: Estes bits devem ser 0, a menos que seja negociada uma extensão que lhes forneça um valor não nulo.</li>
<li><span style="line-height: 1.572;"><em>Opcode</em>: Estes bits descrevem o tipo de mensagem recebida. O código <em>Opcode </em>0x1 significa que se trata de uma mensagem de texto (ver <a href="http://tools.ietf.org/html/rfc6455#section-5.2">lista completa de <em>Opcodes</em></a>).</span></li>
</ul>
<p>O segundo byte, que tem atualmente um valor de 131, é outro campo de bits que se decompõe assim:</p>
<table>
<thead>
<tr>
<th scope="col">MASK (Bit 0)</th>
<th scope="col">Comprimento do conteúdo da mensagem (Bit 1:7)</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>0x83=0000011</td>
</tr>
</tbody>
</table>
<ul>
<li>MASK bit: Define se os "dados de <em>payload</em>" são mascarados. Se definida como 1, uma chave de máscara está presente em Masking-Key, e é utilizada para desmascarar os "dados de <em>payload</em>". Todas as mensagens do cliente para o servidor têm este bit definido.</li>
<li>Comprimento do <em>payload</em>: Se este valor estiver entre 0 e 125, então é o comprimento da mensagem. Se for 126, os 2 bytes seguintes (inteiro de 16 bits sem assinatura) são o comprimento. Se for 127, os 8 bytes seguintes (inteiro de 64 bits sem assinatura) são o comprimento.</li>
</ul>
<div class="note">
<p>Porque o primeiro bit é sempre 1 para mensagens cliente-servidor, pode subtrair 128 deste byte para se livrar do bit MASK.</p>
</div>
<p>Note que o bit MASK está definido na nossa mensagem. Isto significa que os quatro bytes seguintes (61, 84, 35, e 6) são os bytes de máscara utilizados para descodificar a mensagem. Estes bytes mudam com cada mensagem.</p>
<p>Os restantes bytes são a <em>payload</em> da mensagem codificada.</p>
<h3 id="Algoritmo_para_descodificar">Algoritmo para descodificar</h3>
<p><em>D<sub>i</sub></em> = <em>E<sub>i</sub></em> XOR <em>M</em><sub>(<em>i</em> mod 4)</sub></p>
<p>onde <em>D</em> é a série de bytes da mensagem descodificados, <em>E</em> é a série de bytes da mensagem codificados, <em>M</em> é a série de bytes da chave, e <em>i</em> é o índice do byte da mensagem a ser descodificado.</p>
<p>Exemplo em C#:</p>
<pre class="brush: cpp notranslate">Byte[] decoded = new Byte[3];
Byte[] encoded = new Byte[3] {112, 16, 109};
Byte[] mask = new Byte[4] {61, 84, 35, 6};
for (int i = 0; i < encoded.Length; i++) {
decoded[i] = (Byte)(encoded[i] ^ mask[i % 4]);
}</pre>
<h2 id="Exemplo_completo">Exemplo completo</h2>
<p>Aqui tem o código, que foi explorado, na sua totalidade; isto inclui o código do cliente e do servidor.</p>
<h3 id="wsserver.cs">wsserver.cs</h3>
<pre class="notranslate">//
// csc wsserver.cs
// wsserver.exe
using System;
using System.Net;
using System.Net.Sockets;
using System.Text;
using System.Text.RegularExpressions;
class Server {
public static void Main() {
string ip = "127.0.0.1";
int port = 80;
var server = new TcpListener(IPAddress.Parse(ip), port);
server.Start();
Console.WriteLine("Server has started on {0}:{1}, Waiting for a connection...", ip, port);
TcpClient client = server.AcceptTcpClient();
Console.WriteLine("A client connected.");
NetworkStream stream = client.GetStream();
// enter to an infinite cycle to be able to handle every change in stream
while (true) {
while (!stream.DataAvailable);
while (client.Available < 3); // match against "get"
byte[] bytes = new byte[client.Available];
stream.Read(bytes, 0, client.Available);
string s = Encoding.UTF8.GetString(bytes);
if (Regex.IsMatch(s, "^GET", RegexOptions.IgnoreCase)) {
Console.WriteLine("=====Handshaking from client=====\n{0}", s);
// 1. Obtain the value of the "Sec-WebSocket-Key" request header without any leading or trailing whitespace
// 2. Concatenate it with "258EAFA5-E914-47DA-95CA-C5AB0DC85B11" (a special GUID specified by RFC 6455)
// 3. Compute SHA-1 and Base64 hash of the new value
// 4. Write the hash back as the value of "Sec-WebSocket-Accept" response header in an HTTP response
string swk = Regex.Match(s, "Sec-WebSocket-Key: (.*)").Groups[1].Value.Trim();
string swka = swk + "258EAFA5-E914-47DA-95CA-C5AB0DC85B11";
byte[] swkaSha1 = System.Security.Cryptography.SHA1.Create().ComputeHash(Encoding.UTF8.GetBytes(swka));
string swkaSha1Base64 = Convert.ToBase64String(swkaSha1);
// HTTP/1.1 defines the sequence CR LF as the end-of-line marker
byte[] response = Encoding.UTF8.GetBytes(
"HTTP/1.1 101 Switching Protocols\r\n" +
"Connection: Upgrade\r\n" +
"Upgrade: websocket\r\n" +
"Sec-WebSocket-Accept: " + swkaSha1Base64 + "\r\n\r\n");
stream.Write(response, 0, response.Length);
} else {
bool fin = (bytes[0] & 0b10000000) != 0,
mask = (bytes[1] & 0b10000000) != 0; // must be true, "All messages from the client to the server have this bit set"
int opcode = bytes[0] & 0b00001111, // expecting 1 - text message
msglen = bytes[1] - 128, // & 0111 1111
offset = 2;
if (msglen == 126) {
// was ToUInt16(bytes, offset) but the result is incorrect
msglen = BitConverter.ToUInt16(new byte[] { bytes[3], bytes[2] }, 0);
offset = 4;
} else if (msglen == 127) {
Console.WriteLine("TODO: msglen == 127, needs qword to store msglen");
// i don't really know the byte order, please edit this
// msglen = BitConverter.ToUInt64(new byte[] { bytes[5], bytes[4], bytes[3], bytes[2], bytes[9], bytes[8], bytes[7], bytes[6] }, 0);
// offset = 10;
}
if (msglen == 0)
Console.WriteLine("msglen == 0");
else if (mask) {
byte[] decoded = new byte[msglen];
byte[] masks = new byte[4] { bytes[offset], bytes[offset + 1], bytes[offset + 2], bytes[offset + 3] };
offset += 4;
for (int i = 0; i < msglen; ++i)
decoded[i] = (byte)(bytes[offset + i] ^ masks[i % 4]);
string text = Encoding.UTF8.GetString(decoded);
Console.WriteLine("{0}", text);
} else
Console.WriteLine("mask bit not set");
Console.WriteLine();
}
}
}
}</pre>
<h3 id="client.html">client.html</h3>
<pre class="brush: html notranslate"><!doctype html>
<style>
textarea { vertical-align: bottom; }
#output { overflow: auto; }
#output > p { overflow-wrap: break-word; }
#output span { color: blue; }
#output span.error { color: red; }
</style>
<h2>WebSocket Test</h2>
<textarea cols=60 rows=6></textarea>
<button>send</button>
<div id=output></div>
<script>
// http://www.websocket.org/echo.html
var button = document.querySelector("button"),
output = document.querySelector("#output"),
textarea = document.querySelector("textarea"),
// wsUri = "ws://echo.websocket.org/",
wsUri = "ws://127.0.0.1/",
websocket = new WebSocket(wsUri);
button.addEventListener("click", onClickButton);
websocket.onopen = function (e) {
writeToScreen("CONNECTED");
doSend("WebSocket rocks");
};
websocket.onclose = function (e) {
writeToScreen("DISCONNECTED");
};
websocket.onmessage = function (e) {
writeToScreen("<span>RESPONSE: " + e.data + "</span>");
};
websocket.onerror = function (e) {
writeToScreen("<span class=error>ERROR:</span> " + e.data);
};
function doSend(message) {
writeToScreen("SENT: " + message);
websocket.send(message);
}
function writeToScreen(message) {
output.insertAdjacentHTML("afterbegin", "<p>" + message + "</p>");
}
function onClickButton() {
var text = textarea.value;
text && doSend(text);
textarea.value = "";
textarea.focus();
}
</script></pre>
<h2 id="Ver_também">Ver também</h2>
<ul>
<li><a href="/pt-PT/docs/Web/API/WebSockets_API/Escrever_servidores_de_WebSocket">Escrever servidores de WebSocket</a></li>
</ul>
<div id="cke_pastebin"><em> </em></div>
|