초보 개발자

server set 본문

Zoom 클론

server set

taehyeki 2021. 10. 6. 02:18

zoom 클론코딩을 시작하기전에 

bable, express, nodemon, git 등을 설정해준다.

자세한 방법은 생략하겠다. recap - wetube에 상세히 설명 되어있기에...

더 추가가 되겠지만 기본적인 설정을 마쳐주고 

 

server.js

서버를 만들어준다. __dirname은 저 server.js가 속해있는 폴더명이 나옴 

/public에 접근했을 시 server.js가 속해있는 폴더의 public에 접근가능하도록 static설정을 해주었다.

 

http는 유저가 request를 보내면 서버가 respond하는 방식이다. 이건 stateless이다 backend가 유저를 기억하지 못한다.

서버는 무조건 유저로부터 request가 있어야 responsd할 수 있다 먼저 말 걸 수는 없다.

 

websocket을 사용해서 연결하고 싶고 또 서버가 지원한다면 ws로 접근하면 된다. 

websocket 연결이 일어날 땐 마치 악수처럼 작동한다. 브라우저가 wepbsocket request를 보내면 서버가 받거나 거절하거나를 한다. 만약 이런 악수가 한번 성립되면 연결은 성립된다. 그렇기 때문에 서버는 유저가 누구인지 기억할 수 있다.

원한다면 서버가 유저에게 메시지를 보낼 수 있다. 서버는 request를 기다리지 않아도 된다. 먼저 보낼 수도 있다.

req,res과정이 필요하지 않고 그냥 발생한다.

 

이것이 http와 websocket의 차이점이다.

npm i ws

express에서는 ws를 지원안한다.

먼저 node.js에 내장돼있는 http package를 사용해보자.

따로 설치할 필요가 없다. createServer를하려면 requestListener 경로가 있어야 한다. 그 경로를 app으로주자

const server를 만들어 줌으로써 서버가 만들어진다. 이제 이 서버에서 webSocket을 만들 수 있다.

이제 새로운 webSocket서버를 만들어 볼 것이다. 위에서만든건 http서버이고 이제 webSocket서버를 만들거다.

그리고 WebSocket.Server에서 위에서만든 http server를 전달해 줄 수있다. 굳이 넣지 않아도 된다. 필수는 아니다.

이렇게 하면 http서버, webSocket서버 둘 다 돌릴 수 있기 때문이다. 어쩔 땐 http서버를 원하지 않을 때도 있다. 

( app.use , app.get views, static files, home, redirection 을 원하기 때문에 사용.... ) 그럴 때는 webSocket서버만 만들면 된다. 여기선 같은 서버에서 http와 webSocket 둘 다 작동시키는 것이다.

 

이렇게 하는 이유는 우리의 서버를 만들고(보이게 노출 시키고) 그 다음 http서버 위에 ws서버를 만들기 위함이다.

그러므로 localhost는 동일한 포트에서 http, ws request 두 개를 다 처리할 수 있다.

 

 

'Zoom 클론' 카테고리의 다른 글

Room chat 2  (0) 2021.10.08
Room chat 1  (0) 2021.10.07
socket IO  (0) 2021.10.06
socket의 기본 chat원리  (0) 2021.10.06
WebSocket  (0) 2021.10.06