======
spring:
rabbitmq:
host: localhost
port: 5672 //ampq프로토콜연결 : 5672, stomp 프로토콜 연결 61613
username: rabbitmq아이디
password: rabbitmq비밀번호
virtual-host: /
//rabbitmq
implementation 'org.springframework.boot:spring-boot-starter-amqp' implementation 'com.fasterxml.jackson.core:jackson-databind'
implementation 'org.springframework.boot:spring-boot-starter-reactor-netty'
//websocket
implementation 'org.springframework.boot:spring-boot-starter-websocket'
//자바스크립트에서 가져다 쓸려고 추가했음
implementation 'org.webjars:sockjs-client:1.1.2'
implementation 'org.webjars:stomp-websocket:2.3.3-1'
@Configuration
@EnableWebSocketMessageBroker
public class WebSocketConfig implements WebSocketMessageBrokerConfigurer {
@Value("${spring.rabbitmq.host}")
private String host;
@Value("${spring.rabbitmq.username}")
private String username;
@Value("${spring.rabbitmq.password}")
private String password;
@Override
public void registerStompEndpoints(StompEndpointRegistry registry) {
System.out.println("host : "+host+" username : "+username+" password : "+password);
registry.addEndpoint("websocketApp").setAllowedOrigins("*")
.withSockJS();
}
@Override
public void configureMessageBroker(MessageBrokerRegistry registry) {
registry.setApplicationDestinationPrefixes("/app");
registry.enableStompBrokerRelay("/topic")
.setRelayHost(host)
.setRelayPort(61613)
.setSystemLogin(username)
.setSystemPasscode(password)
.setClientLogin(username)
.setClientPasscode(password);
}
}
@Component
@RequiredArgsConstructor
public class WebSocketChatEventListener {
private static final Logger log= LoggerFactory.getLogger(WebSocketChatEventListener.class);
private final SimpMessageSendingOperations messagingTemplate;
@Value("${spring.rabbitmq.username}")
private String username;
@Value("${spring.rabbitmq.password}")
private String password;
@EventListener
public void handleWebSocketConnectListener(SessionConnectEvent event){
log.info("===========");
log.info("new web socket connection");
log.info("===========");
}
@EventListener
public void handleWebSocketDisconnectListener(SessionDisconnectEvent event){
StompHeaderAccessor headerAccessor=StompHeaderAccessor.wrap(event.getMessage());
String username=(String)headerAccessor.getSessionAttributes().get("username");
if(username != null) {
CustomMessage chatMessage = new CustomMessage("Leave",username,"나감");
messagingTemplate.convertAndSend("/topic/public", chatMessage);
}
}
}
@Controller
public class WebSocketChatController {
@MessageMapping("/chat.sendMessage")
@SendTo("/topic/javainuse")
public CustomMessage sendMessage(@Payload CustomMessage webSocketChatMessage) {
return webSocketChatMessage;
}
@MessageMapping("/chat.newUser")
@SendTo("/topic/javainuse")
public CustomMessage newUser(@Payload CustomMessage webSocketChatMessage,
SimpMessageHeaderAccessor headerAccessor) {
headerAccessor.getSessionAttributes().put("username", webSocketChatMessage.getSender());
return webSocketChatMessage;
}
}
var stompClient = null;
var name = null;
function connect(event) {
name = '홍길동';
if (name) {
//WebSocketConfig의 EndPoint
var socket = new SockJS('/websocketApp');
stompClient = Stomp.over(socket);
stompClient.connect({}, connectionSuccess);
}
event.preventDefault();
}
function connectionSuccess() {
var str='<div>'+'연결성공' +'</div>'
$('#messageList').prepend(str);
//sendTo("/topic/javainuse") 로 들어오는 메세지를 받겠다
stompClient.subscribe('/topic/javainuse', onMessageReceived);
stompClient.send("/app/chat.newUser", {}, JSON.stringify({
sender : name,
type : 'newUser'
}))
}
function sendMessage(event) {
var messageContent = $('#content').val();
if (messageContent && stompClient) {
var chatMessage = {
sender : name,
content : messageContent,
type : 'CHAT'
};
stompClient.send("/app/chat.sendMessage", {}, JSON
.stringify(chatMessage));
$('#content').val('');
}
event.preventDefault();
}
function onMessageReceived(payload) {
var message = JSON.parse(payload.body);
var msgList=$('#messageList');
if (message.type === 'newUser') {
msgList.prepend('<div>'+'새로운 유저 입장 '+message.sender +'</div>');
} else if (message.type === 'Leave') {
msgList.prepend('<div>'+' 유저 떠남 '+message.sender +'</div>');
} else {
msgList.prepend('<div>'+message.content +'</div>');
}
}