실시간 14

2. 웹소켓 서버 구현

node.js에는 ws라는 라이브러리 지원됨. 일단 그럼 npm i ws 해서 설치 근데, 우리가 기존에 서버를 express로 쓰고 있었는데, express는 http지 웹소켓이 아님. 그래서 express에 ws를 사용할 수 있도록 추가해 줄거임. 약간 바뀌었다. import express from "express"; import http from "http"; import WebSocket, { WebSocketServer } from 'ws'; const app = express(); app.set("view engine", "pug"); app.set("views", __dirname + "/views"); app.use("/public", express.static(__dirname + "/p..

1. HTTP와 WebSocket

HTTP http는 stateless, 딱히 무언가 상태를 저장하고 있지 않음. (회원가입등은 서버가 DB와 연결하여 DB에 저장하는 거지 서버 자체에서 변수로 뭘 가지고 있거나 그러지 않음.) 즉 클라이언트에 대한 무언가를 저장하고 있지 않음. request가 오면 요청을 받고 response를 보냄. 끝임. 딱히 연결되어 있다거나 그런 게 아니고, 그냥 요청오면 응답 보내고 끝임. 마치 프린터 처럼 인쇄요청이 오면 인쇄 한 다음 끝임. 그냥 대기상태. 웹소켓은, 연결 요청을 보냄. 그럼 연결 수락응답을 보내면, 연결된거임. 즉, 클라이언트와 서버가 서로 기억함 이렇게 연결하면, 이제 서버는 프린터 같은 게 아니라 그냥 맘대로 클라이언트한테 데이터 보내고 할 수 있음. 요청 안와도. 양방향 통신이 됨...

2. 환경

환경은 node.js 이다. 바벨 (최신버전 자바스크립트를 서버 혹은 웹브라우저에 맞는 ES5 자바스크립트 언어로 만들어 주는) nodemon 이건 코드를 바꾸면 실시간으로 반영해주기 위한 그 다음 express 이거는 서버 뭐 그런 거 같음. pug 이거는 html 쉽게 쓰는거임. { "name": "zoom", "version": "1.0.0", "description": "Zoom Clone using WebRTC and Websockets", "main": "index.js", "scripts": { "dev": "nodemon" }, "keywords": [], "author": "", "license": "ISC", "devDependencies": { "@babel/cli": "^7.23.0..