websocket传输图片

WebSocket协议是一种基于TCP的通信协议，可以实现实时双向通信。通过WebSocket协议可以传输不同类型的数据，包括文本、二进制数据、图片等。

传输图片时，可以将图片以二进制数据的形式传输。以下是一个基本的示例代码：

// 建立WebSocket连接
var socket = new WebSocket('ws://localhost:8080');

// 发送图片
var img = document.getElementById('image');
var canvas = document.createElement('canvas');
var ctx = canvas.getContext('2d');
canvas.width = img.width;
canvas.height = img.height;
ctx.drawImage(img, 0, 0, img.width, img.height);
var dataURL = canvas.toDataURL('image/jpeg');
socket.send(dataURL);

在服务端接收到图片数据后，可以将其转换为二进制数据，并保存为图片文件。以下是一个基本的示例代码：

// 接收数据
socket.onmessage = function(event) {
  var dataURL = event.data;
  var binary = atob(dataURL.split(',')[1]);
  var array = new Uint8Array(binary.length);
  for (var i = 0; i < binary.length; i++) {
    array[i] = binary.charCodeAt(i);
  }
  var blob = new Blob([array], {type: 'image/jpeg'});

  // 保存为图片文件
  var fs = require('fs');
  fs.writeFile('image.jpg', blob, function(err) {
    if (err) throw err;
    console.log('Saved!');
  });
};

需要注意的是，WebSocket传输数据时需要考虑数据大小的限制，尤其是在传输大型图片时。可以将图片切分成多个数据包进行传输，并在服务端进行组装。同时，为了提高传输效率，可以使用WebSocket压缩扩展进行压缩。