gpt4 book ai didi

java - 使用 websocket javascript 客户端发送文件

转载 作者:塔克拉玛干 更新时间:2023-11-02 20:01:54 25 4
gpt4 key购买 nike

我正在尝试使用 websocket 连接将文件发送到我的服务器:我已经使用 java Spring 实现了 websocket 服务器端客户端在 javaScript 中出于某种原因,每次我使用“blob”或“arraybuffer”从客户端发送二进制消息时。服务器将该消息识别为文本消息而不是二进制消息。我在这里错过了什么?

客户端

 <!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Chat</title>
</head>
<body>
<h2>File Upload</h2>
Select file
<input type="file" id="filename" />
<br><br><br>
<input type="button" value="Connect" onclick="WebSocketTest()" />
<br><br><br>
<input type="button" value="Upload" onclick="sendFile()" />

<script>
"use strict"
var ws;
function WebSocketTest()
{
if ("WebSocket" in window)
{
console.log("WebSocket is supported by your Browser!");
// Let us open a web socket
ws = new WebSocket("ws://xx.xx.xx.xx:yyyy/service/audioHandler");
ws.onopen = function()
{
// Web Socket is connected, send data using send()
ws.send(JSON.stringify({userName:'xxxx',password:'sgdfgdfgdfgdfgdf'}));
console.log("Message is sent...");
};
ws.onmessage = function (evt)
{
var received_msg = evt.data;
console.log("Message is received...");
};
ws.onclose = function()
{
// websocket is closed.
console.log("Connection is closed...");
};
}
else
{
// The browser doesn't support WebSocket
console.log("WebSocket NOT supported by your Browser!");
}
}

function sendFile() {
var file = document.getElementById('filename').files[0];
ws.binaryType = "arraybuffer";
//ws.send('filename:'+file.name);
var reader = new FileReader();
var rawData = new ArrayBuffer();
console.log(file.name);
reader.loadend = function() {
}
reader.onload = function(e) {
rawData = e.target.result;
ws.send(rawData);
console.log("the File has been transferred.")
//ws.send('end');
}
reader.readAsArrayBuffer(file);
}
</script>
</body>
</html>

服务器端

public class WebSocketController extends BinaryWebSocketHandler {

@Autowired
private ApplicationContext applicationContext;

@Autowired
private CallScopeStore callScopeStore;

private static Logger logger = Logger.getLogger(AudioHandler.class);
private static final String STOP_MESSAGE = "stop";

@Override
protected void handleBinaryMessage(WebSocketSession session, BinaryMessage message) {
try {
//do something....
} catch (Exception e) {
logger.error(e, e);
throw new RuntimeException(e);
}
}

@Override
protected void handleTextMessage(final WebSocketSession session, TextMessage message) {
try {
//do something....
}
} catch (Exception e) {
logger.error(e, e);
throw new RuntimeException(e);

}
}
}

最佳答案

您必须将文件作为 blob 发送。

ws = new WebSocket("ws://xx.xx.xx.xx:yyyy/service/audioHandler");
ws.binaryData = "blob";
ws.send(message); // Blob object

您可能会发现您提到的错误:“CloseStatus[code=1009, reason=No async message support and buffer too small. Buffer size: [8,192], Message size: [7,816,684]]”。发生这种情况是因为您的 WebSocket 引擎需要配置为允许具有您想要的大小的二进制消息。例如,在您的 WebSocketConfig 中:

@Bean
public ServletServerContainerFactoryBean createWebSocketContainer() {
ServletServerContainerFactoryBean container = new ServletServerContainerFactoryBean();
container.setMaxTextMessageBufferSize(500000);
container.setMaxBinaryMessageBufferSize(500000);
return container;
}

如您所见,您可以设置文本和二进制消息允许的最大大小,只需指定大于 7,816,684(您尝试发送的文件)的大小即可。默认情况下,您的缓冲区大小为 [8,192],因此如果您发送的文件大小小于您的缓冲区大小,应该不会有问题。更多信息可以查看websocket spring documentation .

关于java - 使用 websocket javascript 客户端发送文件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27959052/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com