[Swift] Socket.IO를 이용한 소켓통신 채팅앱 만들어보기 (3/3)

이번게시물은 Swift 관련 게시물이아니지만...

전 게시물과 이어지는 관계로 그냥 썼어요,,,

 

앞에서 소개한 소켓을 테스트해보려면

서버가 필요하잖아요!?!?!

 

제가 서버를 잘하진 못해서 간단하게 구현한 서버를 소개하려고 해요!!

 

이렇게 하는구나~~

느낌만알면 서버를 많이 해본 사람들은 응용해서

뚝딱 만들수 있을거에요!!

 

 

우선 Node를 깔아주세요!!!

https://nodejs.org/ko/download/

 

그다음에 npm이란 패키지 매니저를 깔거에요

npm은 모듈을 편리하게 사용할 수 있도록 해주는거에요

마치 pod과같은 느낌이에요

 

다음으로는 express 라는 프레임워크를 깔아줄거에요

node js 프레임워크로 프로젝트를 만들때 사용해요

저는 코드편집기로 VSCode를 사용해요

 

명령어를 사용하다가 에러로 permission이뜬다?!

맨앞에 sudo를 붙여주세요!!

npm install -g express-generator

 

다음으로는 프로젝트를 생성하고

express <프로젝트이름>

 

모듈을 설치할거에요

npm install

 

잘되나 실행한번해볼게요

npm start

 

npm start명령어대신에

저희가 저장을 누를때마다 자동으로 갱신되는 명령어를 쓸꺼에요

nodemon이라고 설치를 먼저 해볼게요

npm install -g nodemon

 

nodemon을 실행시켜주세요

nodemon

 

이제 저장만하면 자동으로 서버가 갱신되요!!!

할때마다 node start를 할필요가 없어요이젠!!

 

다음으로는 socket.io를 사용해야하니까 모듈을 다운받을거에요

npm install --save --save-exact socket.io express

 

npm을 업데이트해주세요

npm update

 

자 그럼 환경 세팅은 끝났어요

 

이제 코드를 간단하게 볼게요

 

const app = require('express');
const router = app.Router();
const http = require('http').Server(app);
const io = require('socket.io')(http);

const room = io.of('/test');
const aroom = io.of('/a');
const broom = io.of('/b');
const croom = io.of('/c');

const userList = [
  {
    "id": "1",
    "name": "ns",
    "isConneted": false
  },
  {
    "id": "2",
    "name": "jm",
    "isConneted": false
  },
  {
    "id": "3",
    "name": "jh",
    "isConneted": false
  },
  {
    "id": "4",
    "name": "hj",
    "isConneted": false
  }
]

const chatRoom = [
  {
    'name' : '1',
    'room' : [ "test", "b", "c" ]
  },
  {
    'name' : '2',
    'room' : [ "d", "b", "c" ]
  }
]


router.get('/', function (req, res) {
  room.emit('test', {
    'Hello': 'World',
    'test': 'good'
  });
  res.send('<h1>AppCoda - SocketChat Server</h1>');
});


router.get('/getChatList/:name', (req, res) => {
  const name = req.params.name
  const list = []
  
  chatRoom.forEach(element => {
    if( element.name == name ){
      list.push(element)
    }
  }); 

  res.send(list)
})

 

express 모듈사용을위해서 선언해주고

router도 가져오고

소켓통신을위해

io라는 변수까지 만들엇어요

 

io.of('룸이름') 을 통해서 소켓의 룸을 구분할 수 있어요

룸은 앞에서 설명했기때문에 따로 설명하지 않을께요!!

 

localhost:3000/getChatList/:name

으로 접속한다면 name값에 해당하는 채팅방 목록을 주기위해서 설정해놧어요

 

 

http.listen(9000, function () {
  console.log('Listening on *:9000');
});

9000포트로 들어오는 소켓 접속을 대기해요

 

 

room.on('connection', (clientSocket) => {
  console.log('*** test connected ***');
  console.log(clientSocket.id)

  //echo
  //user = 0, other = 1
  clientSocket.on('test', (msg) => {
    console.log(msg)
    room.emit('test', { 
      'type' : 1,
     'message' : msg })
  })

  clientSocket.on('disconnect', function () {
    clientSocket.disconnect();
    console.log('test disconnected');
  })
  
  clientSocket.on('event', (msg) => {
    console.log(msg)
    console.log(msg["message"])
    console.log('*************')
  })

  clientSocket.on('event1', (msg) => {
    console.log(msg)
    console.log(msg[0]["name"])
    console.log(msg[1]["email"])

    clientSocket.emit('test', { 'res': 'event1 response!' })
  })

  clientSocket.on('event2', (msg) => {
    console.log(msg)
    console.log(msg["name"])
    console.log(msg["email"])

    clientSocket.emit('test', { 'res': 'event2 response!' })
  })
})

 

스위프트에서 SocketIO를 쓴것처럼

on, emit이 보이죠??

기능은 똑같아요

 

room.on이면 

아까 room은 /test룸의 변수엿어요

해당 룸의이벤트가 오면 메시지를 받아서 처리하는 부분이에요

on('<이벤트이름>', (<소켓>) => { <실행코드> })

이런 느낌이에요 감이오시나요

 

<소켓>을 받아서 다른 이벤트를 추가적으로 구현할수도있어요

이 <소켓>을 이용해서 구현하면 서로 연결된 그 <소켓>에게만 이벤트를 줄 수 있지만

 

위처럼 room.emit같이

룸단위를 활용하면

해당룸에 들어있는 소켓 전부에게 이벤트를 줄 수 있어요

개인이냐 룸 안에있는 모두냐의 차이죠!!!

 

몇몇개의 이벤트는 정해져있어요

connection, disconnect,등 정해진 이벤트가 있어요

 

데이터 파싱은 해당 데이터의 형태에맞게

딕셔너리 형태, 배열,등 잘 꺼내서 이용할 수 있어요

 

 

이 정도로 간단한 소켓서버구현을 마칠게요!!

 

레퍼런스와 문서를 참조해서 더 다양한 기능을 참조해보세요!!

 

⬇️⬇️채팅앱 UI구현⬇️⬇️

2019/12/17 - [iyOmSd/Title: Swift] - [Swift] Socket.IO를 이용한 소켓통신 채팅앱 만들어보기 (2/3)

[Swift] Socket.IO를 이용한 소켓통신 채팅앱 만들어보기 (2/3)

 

⬇️⬇️소켓구현⬇️⬇️

2019/12/13 - [iyOmSd/Title: Swift] - [Swift] Socket.IO를 이용한 소켓통신 채팅앱 만들어보기 (1/3)

[Swift] Socket.IO를 이용한 소켓통신 채팅앱 만들어보기 (1/3)