WebSocket
2023. 12. 13. 21:54ㆍNode.js Express
const orderHandler = (io, socket) => {
const connectUser = function () {
console.log("new user");
}
const userJoin = function (name = "default") {
console.log(`${name} join`);
}
const new_message = (message) => {
username = "default";
io.emit('chat', {"message": message.message, "username":message.name});
}
const testOrder1 = function (test) {
console.log(test);
test += ", message from server "
io.emit('test2', {"message":test})
}
socket.on("connect",connectUser);
socket.on("user_join",userJoin);
socket.on("new_message", new_message);
socket.on("test",testOrder1);
}
module.exports = {
orderHandler,
}
const { Server } = require("socket.io");
const io = new Server(server);
const {orderHandler} = require('./controllers/websocket_controller')
const onConnection = (socket) => {
orderHandler(io, socket);
}
io.on('connection', onConnection);
<!doctype html>
<html lang="ko">
<head>
<meta charset="utf-8">
</head>
<body>
<input type="text" id="username" placeholder="Username">
<button id="join-btn">JOIN</button><br>
<input type="text" id="username123" value = "test data" placeholder="Username">
<script src="/socket.io/socket.io.js"></script>
<script>
var socket = io();
document.getElementById("join-btn").addEventListener("click", function() {
let username = document.getElementById("username").value;
socket.connect();
socket.on('connect', function() {
console.log('connect');
});
socket.emit('test', username);
document.getElementById("username").value = ""
})
socket.on("test2", function(data) {
document.getElementById("username123").value = data["message"];
})
</script>
</body>
</html>
soket.io라는 모듈을 이용하여 websocket을 구축 할 수 있다