WebSocket 基础与应用系列 —— 抓个 WebSocket 的包

// 导入WebSocket模块:
const WebSocket = require('ws');

// 引用Server类:
const WebSocketServer = WebSocket.Server;

// 实例化:
const wss = new WebSocketServer({
    port: 3000
});
wss.on('connection', function (ws) {
    console.log(`[SERVER] connection()`);
    ws.on('message', function (message) {
        console.log(`[SERVER] Received: ${message}`);
        ws.send(`message from server: ${message}`, (err) => {
            if (err) {
                console.log(`[SERVER] error: ${err}`);
            }
        });
    })
});

const WebSocket = require('ws');
const ws = new WebSocket('ws://localhost:3000/');

ws.on('open', function open() {
  console.log('[CLIENT]: open')
  ws.send('something');
});

ws.on('close', function close(){
  console.log('[CLIENT]: close');
});
ws.on('message', function incoming(data) {
  console.log('[CLIENT]: Received:',data);
});
ws.on('ping', function(){
  console.log('[CLIENT]: ping')
})

[SERVER] connection()
[SERVER] Received: something

[CLIENT]: open
[CLIENT]: Received: message from server: something

const net = require('net');

const server = net.createServer();

server.on('connection', (socket) => {
  socket.on('data', (data) => {
    console.log('Receive from client:', data.toString('utf8'));
  });
  socket.write('Hello, I am from server.');
});

server.listen(3000, () => {
  console.log('Server is listenning on 3000');
});

const net = require('net');

const client = new net.Socket();

client.setEncoding('utf8');

client.connect(3000, () => {
  console.log('Connected to server.');
  client.write('Hello, I am from client.');
  client.on('data', (data) => {
    console.log('Receive from server:', data);
  });
});

const http = require('http');

const server = http.createServer();

server.on('request', (req, res) => {
  console.log('request ...');
  req.on('data', (data) => {
    console.log('data from client ', data.toString('utf-8'));
  });
  res.write('Hello, I am Server');
  res.end();
});

server.listen(3000);

const request = require('request');

request('http://127.0.0.1:3000?param=1', (err, response, body) => {
  console.log('Response:', body);
});

toBase64( sha1( Sec-WebSocket-Key + 258EAFA5-E914-47DA-95CA-C5AB0DC85B11 )  )

const crypto = require('crypto');

const magic = '258EAFA5-E914-47DA-95CA-C5AB0DC85B11';
const secWebSocketKey = '8cyP/EvUjJHSMbkOIHFU/w==';

const secWebSocketAccept = crypto.createHash('sha1')
  .update(secWebSocketKey + magic)
  .digest('base64');

console.log(secWebSocketAccept);
// EiaKGKO0E/pC8vnArob263aS3XY=

  0                   1                   2                   3
  0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1
 +-+-+-+-+-------+-+-------------+-------------------------------+
 |F|R|R|R| opcode|M| Payload len |    Extended payload length    |
 |I|S|S|S|  (4)  |A|     (7)     |             (16/64)           |
 |N|V|V|V|       |S|             |   (if payload len==126/127)   |
 | |1|2|3|       |K|             |                               |
 +-+-+-+-+-------+-+-------------+ - - - - - - - - - - - - - - - +
 |     Extended payload length continued, if payload len == 127  |
 + - - - - - - - - - - - - - - - +-------------------------------+
 |                               |Masking-key, if MASK set to 1  |
 +-------------------------------+-------------------------------+
 | Masking-key (continued)       |          Payload Data         |
 +-------------------------------- - - - - - - - - - - - - - - - +
 :                     Payload Data continued ...                :
 + - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - +
 |                     Payload Data continued ...                |
 +---------------------------------------------------------------+

// 来自 ws库 sender.js frame函数
    let payloadLength = data.length;

    if (data.length >= 65536) {
      offset += 8;
      payloadLength = 127;
    } elseif (data.length > 125) {
      offset += 2;
      payloadLength = 126;
    }

//mask key的生成
//每个数据帧都会生成一次
const mask = Buffer.alloc(4);
randomFillSync(mask, 0, 4);

j = i MOD 4
transformed-octet-i = original-octet-i XOR masking-key-octet-j

// mask 的生成
// const mask = crypto.randomBytes(4);
// <Buffer 54 63 0c 77>
/**
 * Masks a buffer using the given mask.
 *
 * @param {Buffer} source The buffer to mask
 * @param {Buffer} mask The mask to use
 * @param {Buffer} output The buffer where to store the result
 * @param {Number} offset The offset at which to start writing
 * @param {Number} length The number of bytes to mask.
 * @public
 */
function _mask(source, mask, output, offset, length) {
  for (var i = 0; i < length; i++) {
    output[offset + i] = source[i] ^ mask[i & 3];
  }
}

/**
 * Unmasks a buffer using the given mask.
 *
 * @param {Buffer} buffer The buffer to unmask
 * @param {Buffer} mask The mask to use
 * @public
 */
function _unmask(buffer, mask) {
  // Required until https://github.com/nodejs/node/issues/9006 is resolved.
  const length = buffer.length;
  for (var i = 0; i < length; i++) {
    buffer[i] ^= mask[i & 3];
  }
}

/**
  * Frames a piece of data according to the HyBi WebSocket protocol.
  *
  * @param {Buffer} data The data to frame
  * @param {Object} options Options object
  * @param {Number} options.opcode The opcode
  * @param {Boolean} options.readOnly Specifies whether `data` can be modified
  * @param {Boolean} options.fin Specifies whether or not to set the FIN bit
  * @param {Boolean} options.mask Specifies whether or not to mask `data`
  * @param {Boolean} options.rsv1 Specifies whether or not to set the RSV1 bit
  * @return {Buffer[]} The framed data as a list of `Buffer` instances
  * @public
  */
function frame(data, options) {
  const merge = data.length < 1024 || (options.mask && options.readOnly);
  let offset = options.mask ? 6 : 2;
  let payloadLength = data.length;

  if (data.length >= 65536) {
    offset += 8;
    payloadLength = 127;
  } elseif (data.length > 125) {
    offset += 2;
    payloadLength = 126;
  }

  const target = Buffer.allocUnsafe(merge ? data.length + offset : offset);

  target[0] = options.fin ? options.opcode | 0x80 : options.opcode;
  if (options.rsv1) target[0] |= 0x40;

  if (payloadLength === 126) {
    target.writeUInt16BE(data.length, 2);
  } elseif (payloadLength === 127) {
    target.writeUInt32BE(0, 2);
    target.writeUInt32BE(data.length, 6);
  }

  if (!options.mask) {
    target[1] = payloadLength;
    if (merge) {
      data.copy(target, offset);
      return [target];
    }

    return [target, data];
  }
//验证一下
  // const mask = crypto.randomBytes(4);
  const mask = Buffer.from('32fd435f', 'hex'); //为了还原例子，这里直接指定mask

  target[1] = payloadLength | 0x80;
  target[offset - 4] = mask[0];
  target[offset - 3] = mask[1];
  target[offset - 2] = mask[2];
  target[offset - 1] = mask[3];

  if (merge) {
    _mask(data, mask, target, offset, data.length);
    return [target];
  }

  _mask(data, mask, data, 0, data.length);
  return [target, data];
}

const str = 'something';
const source = Buffer.from(str);
const target = frame(source, {
  fin: true, rsv1: false, opcode: 1, mask: true, readOnly: false,
});
console.log('Payload:', source);
console.log('Masked payload:', target);

Payload: <Buffer 73 6f 6d 65 74 68 69 6e 67>
Masked payload: [ <Buffer 81 89 32 fd 43 5f 41 92 2e 3a 46 95 2a 31 55> ]

ws.ping('', false, true);