참치코더의 꿈 메모장

Node.js// socket.io 모듈 (1) 본문

Node.js

Node.js// socket.io 모듈 (1)

참치깡 2020. 2. 29. 19:44
728x90

socket.io

 

 

보통 채팅창을 만들때 쓰는 자바스크립트 모듈이다.

 

필요한 준비물은 socket.io, express, http 모듈이 필요하다. 

http 모듈은 기본적으로 자동으로 깔려있기 때문에 npm install socket.io & npm install express 를 하면 된다.

그렇게 모률이 깔리면 코드를 작성해 보자.

 

 

서버를 생성하기 위한 자바스크립트 코드 <서버>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
const socketIo = require('socket.io');
const express = require('express');
const http = require('http');
 
const app = express(); // express 서버생성
const server = http.createServer(app); // http 서버를 생성하고 거기에 express를 대입
const io = socketIo.listen(server); // socket.io의 서버생성
 
// 미들웨어 설정
app.use(express.static(`${__dirname}/public`)); // 해당경로의 public 폴더를 불러온다.
 
io.sockets.on('connection',(socket) => { //클라이언트를 연결시킨다.
  setInterval(() => {// 1초 주기로 반복
  socket.emit('abcd', {message: 'From Server'}); // 클라이언트쪽으로 데이터를 전달.
  socket.on('abcd', (data) => {
  console.log(data);
  }); // 클라이언트에서 데이터를 받는다
},1000);
});
 
server.listen(52273, function(){ // 서버연걸
  console.log('Server Running at http://127.0.0.1:52273');
});
 
 cs

 

 

 

public 폴더에 있는 HTML 파일 <클라이언트>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<!DOCTYPE html>
<html>
  <head>
    <title>Socket.io Basic</title>
    <script src="/socket.io/socket.io.js"></script> // socketIo.listen(server); 즉 socket.io 서버를 생성하면 클라이언트인 HTML 파일에서
//src="/socket.io/socket.io.js" 가 실행이된다.
  </head>
  <body>
    <script>
      var socket = io.connect(); // io 객체안에 있는 connect메서드를 사용하면 서버 연결이 가능하다.
      setInterval(()=>{ // 1초 주기로 반복
      socket.emit('abcd',{message: 'From Client'}); // 서버쪽으로 데이터를 전달
      socket.on('abcd', (data)=> {
        console.log(data);
      }); // 서버에서 데이터를 받는다.
    },1000);
    </script>
  </body>
</html>
 
 cs

 

현재 개발하고 있는 상태이므로 디버그 모드를 활성화 하여 실행하면

명령 프롬프트 창에서 아래와 같은 코드를 입력하면 서로 코드를 1초단위로 전달하는 것을 알 수가 있다.

 

SET DEBUG=socket.io* 

node 자바스크립트파일;

728x90
저작자표시 비영리 (새창열림)

'Node.js' 카테고리의 다른 글

Node.js// request모듈, cheerio모률, async 모듈(1)  (0) 2020.03.04
Node.js// router, static , morgan , cookie parser 미들웨어  (0) 2020.02.18
Node.js // jade 특수기호 , supervisor  (0) 2020.02.12
'Node.js' Related Articles more
Comments