728x90
반응형
요즘 Node 개발에 푹 빠져있습니다.
거의 1년 동안 Node, angular, bootstrap으로 뚝딱뚝딱하고 있으니,,,
참 재미있고 새로운 장난감이라고 생각하고 있죠.
그래서 개인적으로 가지고 있는 소스 하나를 공유하려고 합니다.
소켓 연동 부분인데 아주 기초적인 부분이고
소켓은 잘 알다시피 연결을 보장해줘야 하기 때문에 서버 구축도 신경을 많이 써야 합니다~
아래 소스는 실무에서 그대로 쓸 수 있는 귀한 소스 이다.
그대로 복사해서 돌리면서 Debug를 해보면 쉽게 알 수 있을 것이다.
주석도 함께 달았으니 ;-)
#socketio.js
// 모듈을 추출합니다.
const socketIO = require('socket.io');
const express = require('express');
const http = require('http');
//객체를 선언합니다.
const app = express();
const server = http.createServer(app);
const io = socketIO.listen(server);
//미들웨어를 설정합니다.
app.use(express.static(`${__dirname}/public`));
//웹 소켓을 설정합니다.
io.sockets.on('connection', (socket) => {
setInterval(() => {
socket.emit('abcd', {
mesaage: 'From Server'
});
socket.on('abcd', (data) => {
console.log(data);
});
}, 1000);
});
//서버를 실행합니다.
server.listen(3389, () => {
console.log('Server Running 3389');
});
# ${__dirname}/public/HTMLPage.html
<!DOCTYPE html>
<html>
<head>
<title>Socket.io Basic</title>
<script src="/socket.io/socket.io.js"></script>
</head>
<body>
<script>
//변수를 선언합니다.
var socket = io.connect();
setInterval(() => {
socket.emit(('abcd'), {
message: 'From Client'
});
socket.on('abcd', (data) => {
console.log(data);
});
}, 1000);
</script>
</body>
</html>
#socketioJoin.js
//모듈을 추출합니다.
const socketIO = require('socket.io');
const express = require('express');
const http = require('http');
//객체를 선언합니다.
const app = express();
const server = http.createServer(app);
const io = socketIO.listen(server);
//미들웨어를 설정합니다.
app.use(express.static(`${__dirname}/public`));
//웹 소켓을 설정합니다.
io.sockets.on('connection', (socket) => {
//변수를 선언합니다.
let roomNae = null;
//클라이언트를 방에 배정합니다.
socket.on('joinABCD', (data) => {
roomName = data.roomName;
socket.join(data.roomName);
});
//클라이언트에서 데이터가 전달되면, 배분합니다.
socket.on('message', (data) => {
io.sockets.in(roomName).emit('message', {
message: 'From Server'
});
});
});
//서버를 실행합니다.
server.listen(3389, () => {
console.log('Server Running 3389');
});
# ${__dirname}/public/HTMLJoinPage.html
<!DOCTYPE html>
<html>
<head>
<title>Socket.io Basic</title>
<script src="/socket.io/socket.io.js"></script>
</head>
<body>
<button id="my_button">Click</button>
<script>
//변수를 선언합니다.
var socket = io.connect();
var roomName = prompt('방 이름을 입력해주세요.', '');
//클라이언트를 방에 배정합니다.
socket.emit('joinABCD', {
roomName: roomName
});
//버튼을 클릭하면 문자열을 전달합니다.
var button = document.getElementById('my_button');
button.onclick = function (){
socket.emit('message', {
message: 'From Client'
});
};
//소켓 이벤트를 연결합니다.
socket.on('message', function(data){
alert(data.message);
});
</script>
</body>
</html>
반응형
LIST
'전공 > 실무' 카테고리의 다른 글
[Linux] CentOS 리눅스 명령어 (0) | 2018.04.12 |
---|---|
[Nodejs] 난독화, 복호화(암호화) (0) | 2018.04.12 |
Nodejs 외부모듈 (0) | 2018.02.08 |
[flash]drag&drop (0) | 2012.12.06 |
[flash]flash.external.ExternalInterface.call, 함수 (0) | 2012.12.06 |