Java 通过Tomcat Websocket到HTML5画布的JPG缓冲图像

嘿，我们希望通过tomcat WebSocket定期将缓冲图像发送到画布中，类似于livestream

服务器代码：

private static void broadcastImage(BufferedImage img) {     
    StreamInbound someClient;
    byte[] arr = BufferedImageToByte(img);
    ListIterator<StreamInbound> iter = clients.listIterator();
    while (iter.hasNext()) {
        someClient = (MessageInbound) iter.next();
        try {
            someClient.getWsOutbound().writeBinaryMessage(ByteBuffer.wrap(arr));
        } catch (IOException e) {
            e.printStackTrace();
        }
    }
}

public static byte[] BufferedImageToByte(BufferedImage img) {
    byte[] imageInBytes = null;
    try {
        ByteArrayOutputStream baos = new ByteArrayOutputStream();
        ImageIO.write(img, "jpg", baos);
        baos.flush();
        imageInBytes = baos.toByteArray();
        baos.close();
    } catch (Exception e) {
        e.printStackTrace();
    }
    return imageInBytes;
}

---

非常感谢您的帮助

你真的需要一个webSocket吗？ 如果没有：

否则，请看一下： 还是这个

---

ofc yes

var canvas=document.getElementById（'canvas'）；var ctx=canvas.getContext（'2d'）是否尝试使用：
var img=new Image（）；img.src=数据URL；ctx.drawImage（img，0,0）
ws = new WebSocket("ws://"+ location.host + "/carduinowebdroid/websocket");
ws.binaryType = "arraybuffer";

/** stuff **/

ws.onmessage = function(message){
    if (message.data instanceof ArrayBuffer) {
        streamHandleMessage(message);
    }
}

function streamHandleMessage(message) {
    var canvas = document.getElementById('canvas');
    var ctx = canvas.getContext('2d');

/** what now? **/

}

var can = document.getElementById('canvas');
var ctx = can.getContext('2d');
var img = new Image();
img.onload = function(){
    can.width = img.width;
    can.height = img.height;
    ctx.drawImage(img, 0, 0, img.width, img.height);
}
img.src = 'img.jpg';