spring websocket による画像データ送信
概要
spring websocket でチャット中で画像送信しようとして、バイナリ送信はあきらめていろいろがんばったこと
client side
var file = document.querySelector('input[type="file"]').files[0]; var reader = new FileReader(); reader.onload = function(event){ var loadedImageUri = event.target.result; stompClient.send("/app/room/" + varroomId, {}, JSON.stringify({'imgData': loadedImageUri})); }; reader.readAsDataURL(file);
server side
下記でデータをbyteに変換して画像として保存する
String[] strs = message.getImgData().split(","); byte[] binaryData = Base64.getDecoder().decode(strs[1]);
spring settings
websocket で connection を確立させた後なのでメッセージサイズなどは apache, tomcat をいじっても反映されないので
websocket:transport でサイズを指定する必要がある。
※要検討箇所
<websocket:message-broker application-destination-prefix="/app" > <websocket:transport message-size="2097152" send-buffer-size="2097152"></websocket:transport> <websocket:stomp-endpoint path="/endpoint" > </websocket:stomp-endpoint> <websocket:simple-broker prefix="/topic,/room" /> </websocket:message-broker>
これでなんとか、データの送信はできた。
後は、クライアントに返す際に保存したパスを返却するかサイズが小さな画像のやりとしかないのなら
data:image/png;base64 など、Base64かけたもので返却するとよいかな