Node.js 생태계에서 가장 많이 사용하는 웹 프레임워크인 Express와 Long polling과 Websocket을 쉽게 사용할 수 있는 Socket.io,
그리고 이러한 환경을 멀티 노드로 구성하였을 때, 컨텍스트 간의 상태를 공유하기 위해 Redis store까지 연동하는 방법을 정리한다.
깃허브 링크 -> https://github.com/ahribori/socket.io-redis-express
npm install express socket.io socket.io-redis
import express from 'express';
const app = express();
const server = require('http').createServer(app);
const port = process.argv[2] || process.env.PORT || 8080;
const redis = require('socket.io-redis');
const io = require('socket.io')(server, {
path: '/socket.io', // 클라이언트 사이드 코드의 path와 동일해야 한다.
transports: ['websocket'] // websocket만을 사용하도록 설정
});
// 프로세스를 여러 개 띄웠을 때, 컨텍스트를 공유하기 위해 redis store를 바인딩 시킨다
io.adapter(redis({ host: 'localhost', port: 6379 }));
io.sockets.on('connection', (socket) => {
socket.on('message', (message) => {
console.log(message);
socket.broadcast.emit('message', message);
});
});
server.listen(port, () => {
console.log(`Express listening on port ${port}`);
});
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title>socket io redis store</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script type="text/javascript" src="http://localhost:8080/socket.io/socket.io.js"></script>
<script>
var supportsWebSockets = 'WebSocket' in window || 'MozWebSocket' in window;
if (supportsWebSockets) {
var socket = io('http://localhost:8080', {
path: '/socket.io', // 서버 사이드의 path 설정과 동일해야 한다
transports: ['websocket'] // websocket만을 사용하도록 설정
});
socket.on('message', function(data){
$('#chat').append('<li>'+ data +'</li>');
});
$(function() {
$('#btnSend').click(function(){
socket.emit('message', $('#inputText').val());
$('#chat').append('<li>'+ $('#inputText').val() +'</li>');
$('#inputText').val('');
});
})
} else {
alert('websocket을 지원하지 않는 브라우저입니다.');
}
</script>
</head>
<body>
socketio redis store...<br/>
<input type="text" id="inputText" />
<button id="btnSend">보내기</button>
<ul id="chat"></ul>
</body>
</html>