Fix for issue #10204.

This commit is contained in:
Philippe Soares 2020-10-25 23:05:27 -04:00
parent 5fbc94ae90
commit 7852a3ec2b
4 changed files with 25 additions and 25 deletions

View File

@ -1,73 +1,73 @@
<html> <html>
<head> <head>
<title>Chat WebSocket</title> <title>Chat WebSocket</title>
<script src="./js/sockjs-0.3.4.js"></script> <script src="./js/sockjs-0.3.4.js"></script>
<script src="./js/stomp.js"></script> <script src="./js/stomp.js"></script>
<script type="text/javascript"> <script type="text/javascript">
var stompClient = null; var stompClient = null;
function setConnected(connected) { function setConnected(connected) {
document.getElementById('connect').disabled = connected; document.getElementById('connect').disabled = connected;
document.getElementById('disconnect').disabled = !connected; document.getElementById('disconnect').disabled = !connected;
document.getElementById('conversationDiv').style.visibility = connected ? 'visible' : 'hidden'; document.getElementById('conversationDiv').style.visibility = connected ? 'visible' : 'hidden';
document.getElementById('response').innerHTML = ''; document.getElementById('response').innerHTML = '';
} }
function connect() { function connect() {
var socket = new SockJS('/spring-mvc-java/chat'); var socket = new SockJS('/chat');
stompClient = Stomp.over(socket); stompClient = Stomp.over(socket);
stompClient.connect({}, function(frame) { stompClient.connect({}, function(frame) {
setConnected(true); setConnected(true);
console.log('Connected: ' + frame); console.log('Connected: ' + frame);
stompClient.subscribe('/topic/messages', function(messageOutput) { stompClient.subscribe('/topic/messages', function(messageOutput) {
showMessageOutput(JSON.parse(messageOutput.body)); showMessageOutput(JSON.parse(messageOutput.body));
}); });
}); });
} }
function disconnect() { function disconnect() {
if(stompClient != null) { if(stompClient != null) {
stompClient.disconnect(); stompClient.disconnect();
} }
setConnected(false); setConnected(false);
console.log("Disconnected"); console.log("Disconnected");
} }
function sendMessage() { function sendMessage() {
var from = document.getElementById('from').value; var from = document.getElementById('from').value;
var text = document.getElementById('text').value; var text = document.getElementById('text').value;
stompClient.send("/app/chat", {}, JSON.stringify({'from':from, 'text':text})); stompClient.send("/app/chat", {}, JSON.stringify({'from':from, 'text':text}));
} }
function showMessageOutput(messageOutput) { function showMessageOutput(messageOutput) {
var response = document.getElementById('response'); var response = document.getElementById('response');
var p = document.createElement('p'); var p = document.createElement('p');
p.style.wordWrap = 'break-word'; p.style.wordWrap = 'break-word';
p.appendChild(document.createTextNode(messageOutput.from + ": " + messageOutput.text + " (" + messageOutput.time + ")")); p.appendChild(document.createTextNode(messageOutput.from + ": " + messageOutput.text + " (" + messageOutput.time + ")"));
response.appendChild(p); response.appendChild(p);
} }
</script> </script>
</head> </head>
<body onload="disconnect()"> <body onload="disconnect()">
<div> <div>
<div> <div>
<input type="text" id="from" placeholder="Choose a nickname"/> <input type="text" id="from" placeholder="Choose a nickname"/>
</div> </div>
@ -85,4 +85,4 @@
</div> </div>
</body> </body>
</html> </html>