📌 WebSocket 서버(wss://your-websocket-server.com)를 만드는 구체적인 방법
🔹 WebSocket 서버를 직접 만들고 배포하는 방법
우리는 Node.js와 WebSocket 라이브러리를 사용하여 wss://your-websocket-server.com과 같은 WebSocket 서버를 만들고, 이를 인터넷에서 접근 가능하도록 설정할 것입니다.
🚀 1단계: Node.js 설치
먼저, Node.js가 설치되어 있어야 합니다.
아직 설치하지 않았다면 아래 링크에서 다운로드하세요.
설치 후, 터미널(명령 프롬프트 또는 Mac의 터미널)을 열고 아래 명령어를 입력해 Node.js가 설치되었는지 확인하세요.
버전이 표시되면 정상적으로 설치된 것입니다.
🔥 2단계: 프로젝트 폴더 생성
이제 WebSocket 서버를 만들기 위한 프로젝트 폴더를 생성합니다.
cd my-websocket-server
📌 3단계: 프로젝트 초기화 및 WebSocket 라이브러리 설치
package.json 파일을 생성합니다.
그다음 WebSocket 라이브러리를 설치합니다.
💻 4단계: WebSocket 서버 만들기
이제 server.js 파일을 만들고 WebSocket 서버를 작성합니다.
# 또는
echo > server.js # Windows
파일을 열고 아래 코드를 입력하세요.
✅ 🔹 server.js (WebSocket 서버 코드)
// WebSocket 서버 생성 (포트 8080에서 실행)
const wss = new WebSocket.Server({ port: 8080 });
console.log("✅ WebSocket 서버가 ws://localhost:8080에서 실행 중...");
// 클라이언트가 연결되었을 때의 동작
wss.on('connection', (ws) => {
console.log('🎉 새로운 클라이언트가 연결되었습니다.');
// 클라이언트로부터 메시지를 받았을 때
ws.on('message', (message) => {
console.log(`📩 메시지 수신: ${message}`);
// 모든 클라이언트에게 메시지 전달
wss.clients.forEach(client => {
if (client.readyState === WebSocket.OPEN) {
client.send(`Echo: ${message}`);
}
});
});
// 클라이언트가 연결을 종료했을 때
ws.on('close', () => {
console.log('❌ 클라이언트가 연결을 종료했습니다.');
});
// 클라이언트에게 환영 메시지 보내기
ws.send("👋 환영합니다! WebSocket 서버에 연결되었습니다.");
});
🚀 5단계: WebSocket 서버 실행하기
이제 WebSocket 서버를 실행할 차례입니다.
✅ 실행하면 터미널에 다음과 같은 메시지가 표시됩니다.
이제 WebSocket 서버가 실행되었고, WebSocket 클라이언트에서 연결을 시도할 수 있습니다.
📡 6단계: 실제로 웹 클라이언트에서 연결 테스트하기
이제 WebSocket 클라이언트를 만들어 서버와 통신하는 것을 테스트해 보겠습니다.
✅ 🔹 HTML 파일에서 WebSocket 연결 테스트 (client.html)
웹 브라우저에서 서버에 연결하려면 간단한 HTML 파일을 생성하세요.
파일을 열고 아래 코드를 입력하세요.
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>WebSocket 테스트</title>
</head>
<body>
<h2>WebSocket 클라이언트</h2>
<button onclick="sendMessage()">메시지 보내기</button>
<p id="status">서버와 연결되지 않음</p>
<script>
// WebSocket 서버에 연결
const socket = new WebSocket("ws://localhost:8080");
socket.onopen = function () {
document.getElementById("status").innerText = "✅ 서버와 연결됨!";
};
socket.onmessage = function (event) {
alert("서버로부터 메시지 받음: " + event.data);
};
socket.onclose = function () {
document.getElementById("status").innerText = "❌ 서버 연결 종료됨";
};
function sendMessage() {
socket.send("안녕하세요, 서버!");
}
</script>
</body>
</html>
🔥 웹에서 실행하기
이제 client.html을 열어서 버튼을 클릭하면, WebSocket 서버와 메시지를 주고받을 수 있습니다.
🌍 7단계: WebSocket 서버를 실제 wss://your-websocket-server.com로 배포하기
현재는 **로컬 서버 (ws://localhost:8080)**이므로, 인터넷에서 접근할 수 있는 wss://your-websocket-server.com 같은 HTTPS 및 SSL 지원 WebSocket 서버로 배포해야 합니다.
✅ 방법 1: Node.js 웹 서버를 클라우드에 배포
- VPS(가상 서버)나 AWS, Google Cloud, Heroku, Vercel 같은 서비스 사용
- 서버에서 포트를 열고 실행 (node server.js)
- 도메인과 연결 (your-websocket-server.com)
✅ 방법 2: SSL을 적용한 WebSocket 서버 실행 (wss://)
wss:// 프로토콜을 사용하려면 SSL 인증서가 필요합니다.
- Let’s Encrypt SSL 인증서 발급
- server.js를 수정하여 HTTPS + WebSocket (wss://) 서버 실행
🔹 HTTPS 및 WSS 서버 예제 (server.js)
const https = require('https');
const WebSocket = require('ws');
// SSL 인증서 로드
const server = https.createServer({
cert: fs.readFileSync('/etc/letsencrypt/live/your-domain.com/fullchain.pem'),
key: fs.readFileSync('/etc/letsencrypt/live/your-domain.com/privkey.pem')
});
// WebSocket 서버 생성
const wss = new WebSocket.Server({ server });
server.listen(443, () => {
console.log("✅ WSS 서버가 wss://your-domain.com 에서 실행 중...");
});
// WebSocket 연결 관리
wss.on('connection', (ws) => {
console.log("🎉 클라이언트 연결됨!");
ws.on('message', (message) => {
console.log(`📩 메시지: ${message}`);
ws.send(`서버 응답: ${message}`);
});
ws.on('close', () => {
console.log("❌ 클라이언트 연결 종료");
});
});
이제 웹에서 wss://your-domain.com을 통해 WebSocket 통신 가능! 🚀
🎯 정리
✅ WebSocket 서버를 만들려면
- Node.js 설치
- ws 라이브러리를 설치하고 WebSocket 서버 (server.js) 작성
- 실행 (node server.js) 후 ws://localhost:8080에서 테스트
- 배포하여 wss://your-websocket-server.com에서 사용 가능
🚀 이제 직접 wss://your-websocket-server.com을 만들고 배포할 수 있습니다!
'IT 정보' 카테고리의 다른 글
Websim.ai (0) | 2025.01.30 |
---|---|
4G OFCS(Offline Charging System) 연동을 위해 필요한 연동 규격 (0) | 2025.01.22 |
BAFO (0) | 2025.01.21 |
LI,LMISF는 Lawful Interception Mediation and Service Function의 약자로, 합법적인 감청(Lawful Interception)을 지원하는 시스템의 일부 (0) | 2025.01.10 |
NetOps 솔루션: 네트워크 운영의 자동화와 효율성 높이기위한 솔루션 (0) | 2025.01.10 |