인파

You Can Become A

늦게 시작해도 누구든지 노력하면 개발자가 될수 있어요 !

공부한 내용을 정리합니다
Node.js/Socket.IO

[NODE] 📚 Server Sent Events 💯 정리 (+사용법)

SSE - Server Sent Events 란? SSE는 서버의 데이터를 실시간으로, 지속적으로 Streaming 하는 기술 이다. SSE는 웹 표준으로써 IE를 제외한 모든 브라우저에서 지원되며, IE역시 polyfill을 통해 지원이 가능하다. 기존에는 서버의 변경된 데이터를 가져오기 위해서 페이지 새로고침, 지속적으로 request를 보내는 ajax 폴링, 외부 플러그인 이용등을 사용해야만 했었다. 이외에도 websocket을 사용할 수 있지만 HTTP 통신을 이용하는 것이 아닌 웹소켓만을 위한 별도의 서버와 프로토콜로 통신하기 때문에 구현하는 비용이 많이 든다는 단점이 있다. 하지만 SSE는 기존 HTTP 웹 서버에서 HTTP API 만으로 동작되며 구현도 간단하기 때문에 서버와 프론트엔드 양측..

category_image
인파_
2022.01.28
(0)
Node.js/Socket.IO

[SOCKET] 📚 소켓 미들웨어 개념 & 사용 문법

Socket Middleware 소켓 미들웨어에 대해서는 이전 포스팅에서 소개한 바 있다. 하지만 소켓 미들웨어 문법&기능 에서만 소개를 했고, 왜 이러한 로직이 쓰이는지 자세한 설명을 하기위해 추가적으로 포스팅 해본다. 우리는 이전 포스팅에서, 소켓IO의 io객체 를 외부파일에서 사용하는 방법을 배웠다. const io = req.app.get('io'); // 전역변수로 등록해논 io객체를 가져옴 io.of('/room').emit('newRoom', newRoom); // room네임스페이스에 newRoom 이벤트와 쿼리객체를 보냄 이와 같은 논리로, 소켓 미들웨어는 외부 미들웨어의 데이터를 소켓에서 쓰기 위해 사용하는 기법이라고 보면 된다. express 미들웨어를 예로 들어보자. app.use(..

category_image
인파_
2022.01.27
(0)
Node.js/Socket.IO

[SOCKET] 📚 Namespace & Room 기능 이해하기

Namespace 개념 네임스페이스란 Express의 라우팅처럼 url에 지정된 위치에 따라 신호의 처리를 다르게 하는 기술이다. 서버와 클라이언트가 연결되면 실시간 데이터 공유가 가능한데, socket을 그냥 사용하면 데이터가 모든 socket으로 들어가게 된다. 하지만 특정 페이지에서 소켓이 보내주는 모든 실시간 메세지를 모두 받을 필요는 없다. 불필요하며 낭비이기 때문이다. 그래서 특정 노드끼리만 연결해주는 것이 namespace 이다. 지금까지는 기본 네임스페이스인 / 에 신호를 전송하고 수신했지만, 다른 네임스페이스를 만들어서 신호를 각기 독립적으로 처리할 수도 있는 것이다. 즉, 지정한 Namespace에 있는 소켓 끼리만 통신 한다는 개념이다. Namespace 단어 말 그대로 이름이 붙은 ..

category_image
인파_
2022.01.25
(0)
Node.js/Socket.IO

[SOCKET] 📚 Socket.IO 사용 해보기

Socket.IO node.js에서는 많은 웹 소켓 구현체가 있다. socket.io와 ws가 있다. ws는 기본에 충실한 느낌이고, socket.io는 기본도 기본이지만 뭔가 색다른 기능을 제공한다. 예를 들어 room이라는 기능을 이용해 여러 개의 채팅방을 만들 수 있고 소켓에 연결된 전체 클라이언트에게 broadcast를 보낼 수 있다거나, room 별로 broadcast를 보낼 수 있다. 이런 부분들을 좀 더 쉽고 직관적으로 제공하는 것이 특징이다. 거기다가, HTML5 WebSocket은 매우 유용한 기술이지만 오래된 브라우저의 경우 지원하지 않는 경우가 있다. 브라우저 간 호환이나 이전 버전 호환을 고려하여 Node.js를 위한 강력한 Cross-platform WebSocket API인 So..

category_image
인파_
2022.01.23
(0)
Node.js/Socket.IO

[SOCKET] 📚 WS 웹소켓 사용해보기

WS (Web Socket) [WEB] 🌐 웹 소켓 (Socket) 역사부터 정리 ​ 웹 개발을 처음 배우기 시작했다면 서버와 클라이언트의 통신은 모두 HTTP 프로토콜만 이용해서 이루어진다고 생각할 수 있습니다. 하지만 웹 개발을 하면서 채팅, 게임, 주식 차트 등의 실시 inpa.tistory.com 웹 소켓은 실시간 양방향 데이터 전송을 위한 기술로서, ws 프로토콜 사용하여 통신한다. 최신 브라우저는 대부분 웹 소켓을 지원하며, 노드는 ws나 Socket.IO같은 패키지를 통해 웹 소켓 사용 가능하다. 웹 소켓 이전에는 폴링이라는 방식을 사용했었다. HTTP가 클라이언트에서 서버로만 요청이 가기 때문에 주기적으로 서버에 요청을 보내 업데이트가 있는지 확인했었다. 하지만 이렇게 할 경우 서버에 부담..

category_image
인파_
2022.01.23
(0)