Responsive Advertisement

Node.js와 Raspberry Pi를 이용한 WebSocket 기반 웹서버 구축

앱개발자 찌빠냥
앱개발자 찌빠냥
•

Raspberry Pi는 소형 컴퓨터로, 다양한 IoT 프로젝트나 서버 환경을 구축하는 데 유용하게 사용됩니다. 특히, Node.js를 Raspberry Pi와 함께 사용하면 웹 서버를 쉽게 만들 수 있으며, WebSocket을 통해 실시간 데이터를 처리하는 애플리케이션도 구축할 수 있습니다. 이번 글에서는 Raspberry Pi에서 Node.js를 사용해 WebSocket 기반의 웹 서버를 구축하는 방법을 알아보겠습니다.

Node.js와 Raspberry Pi를 이용한 WebSocket 기반 웹서버 구축


WebSocket이란?

WebSocket은 클라이언트와 서버 간에 실시간 양방향 통신을 가능하게 하는 프로토콜입니다. 일반 HTTP 요청은 클라이언트가 요청을 보내고 서버가 응답하는 단방향 통신 방식인데, WebSocket은 연결이 유지된 상태에서 양방향으로 데이터를 주고받을 수 있어 실시간 애플리케이션에 매우 적합합니다.

WebSocket은 주로 실시간 채팅, 라이브 업데이트, IoT 프로젝트에서 센서 데이터의 실시간 전송 등에 활용됩니다.

Node.js와 WebSocket을 이용한 Raspberry Pi 웹서버 구축

Raspberry Pi에서 WebSocket 기반의 웹 서버를 구축하기 위해서는 Node.js와 WebSocket 패키지가 필요합니다. 아래 단계별로 설치하고 구현하는 방법을 설명하겠습니다.

1. Node.js 설치

Raspberry Pi에서 Node.js를 설치하려면 터미널을 열고 다음 명령어를 입력합니다.

$ curl -sL https://deb.nodesource.com/setup_16.x | sudo -E bash -
$ sudo apt install -y nodejs

이 명령어를 통해 최신 버전의 Node.js와 npm(Node Package Manager)이 설치됩니다. 설치가 완료되면 node -v와 npm -v 명령어로 버전을 확인할 수 있습니다.

2. WebSocket 패키지 설치

Node.js로 WebSocket 서버를 구현하기 위해 WebSocket 패키지를 설치합니다. WebSocket 패키지는 WebSocket 프로토콜을 쉽게 다룰 수 있게 해주는 라이브러리입니다. 프로젝트 폴더를 생성하고 해당 디렉토리에서 WebSocket 패키지를 설치합니다.

$ mkdir websocket-server
$ cd websocket-server
$ npm init -y
$ npm install ws

위 명령어는 프로젝트 초기화를 진행한 후 WebSocket 패키지인 ws를 설치합니다.

3. WebSocket 서버 구현

이제 WebSocket 서버를 구현할 차례입니다. 다음 코드를 통해 간단한 WebSocket 서버를 만들어 봅시다.

// server.js

const WebSocket = require('ws');

// WebSocket 서버 생성
const wss = new WebSocket.Server({ port: 8080 });

wss.on('connection', (ws) => {
    console.log('클라이언트가 연결되었습니다.');

    // 클라이언트로부터 메시지를 받았을 때 실행
    ws.on('message', (message) => {
        console.log('받은 메시지:', message);
        ws.send(`서버에서 받은 메시지: ${message}`);
    });

    // 연결 종료 시 실행
    ws.on('close', () => {
        console.log('클라이언트와의 연결이 종료되었습니다.');
    });
});

console.log('WebSocket 서버가 8080 포트에서 실행 중입니다.');

위 코드는 WebSocket 서버를 8080 포트에서 실행하며, 클라이언트가 서버에 연결되면 메시지를 주고받을 수 있는 구조입니다. 클라이언트가 메시지를 보내면 서버에서 해당 메시지를 출력하고, 다시 클라이언트에게 응답을 보냅니다.

4. 클라이언트 구현

클라이언트 측에서 WebSocket을 이용해 서버와 실시간으로 통신할 수 있는 페이지를 만들어 봅니다. 클라이언트는 HTML과 자바스크립트를 사용하여 WebSocket 연결을 만들고 메시지를 주고받을 수 있습니다.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>WebSocket 클라이언트</title>
</head>
<body>
    <h1>WebSocket 클라이언트</h1>
    <input type="text" id="messageInput" placeholder="메시지를 입력하세요">
    <button id="sendButton">전송</button>
    <div id="response"></div>

    <script>
        const ws = new WebSocket('ws://localhost:8080');

        // 서버와 연결되었을 때 실행
        ws.onopen = () => {
            console.log('서버와 연결되었습니다.');
        };

        // 서버로부터 메시지를 받았을 때 실행
        ws.onmessage = (event) => {
            const responseDiv = document.getElementById('response');
            responseDiv.innerText = `서버 응답: ${event.data}`;
        };

        // 서버로 메시지 전송
        document.getElementById('sendButton').addEventListener('click', () => {
            const message = document.getElementById('messageInput').value;
            ws.send(message);
        });

        // 서버와 연결이 종료되었을 때 실행
        ws.onclose = () => {
            console.log('서버와의 연결이 종료되었습니다.');
        };
    </script>
</body>
</html>

이 클라이언트 코드는 WebSocket 서버에 연결한 후, 입력된 메시지를 서버로 전송하고 서버에서 받은 응답을 화면에 표시합니다. ws://localhost:8080 주소를 통해 WebSocket 서버에 연결됩니다.

5. 서버 실행 및 테스트

이제 서버와 클라이언트를 실행하여 WebSocket 통신을 테스트해봅시다.

  1. 먼저 터미널에서 server.js 파일을 실행합니다.
$ node server.js

터미널에서 서버가 실행 중이라는 메시지를 확인할 수 있습니다.

  1. 그런 다음, 브라우저에서 클라이언트 HTML 파일을 실행합니다. 로컬 서버로 호스팅하거나, 파일을 열어 직접 테스트할 수 있습니다.

클라이언트 페이지에서 메시지를 입력한 후 '전송' 버튼을 클릭하면, 메시지가 WebSocket 서버로 전송되고 서버의 응답을 받을 수 있습니다. 이 과정에서 서버와 클라이언트 간에 실시간으로 데이터를 주고받는 것을 확인할 수 있습니다.

WebSocket과 Node.js의 확장 가능성

Node.js와 WebSocket을 활용하면 실시간 데이터를 필요로 하는 다양한 애플리케이션을 구축할 수 있습니다. 예를 들어, 다음과 같은 프로젝트를 확장할 수 있습니다:

  • 실시간 채팅 애플리케이션: WebSocket을 사용하여 다중 사용자 간의 실시간 채팅을 구현할 수 있습니다.
  • IoT 데이터 스트리밍: Raspberry Pi의 센서 데이터를 WebSocket을 통해 실시간으로 웹 애플리케이션에 전송할 수 있습니다.
  • 실시간 알림 시스템: WebSocket을 통해 특정 이벤트나 알림을 실시간으로 클라이언트에게 전달할 수 있습니다.
  • 온라인 게임: WebSocket을 통해 빠른 응답이 필요한 멀티플레이어 게임을 구현할 수 있습니다.

결론

Node.js와 WebSocket을 사용하여 Raspberry Pi에서 실시간 통신을 위한 웹 서버를 쉽게 구축할 수 있습니다. WebSocket의 양방향 통신 기능을 활용하면, 실시간 데이터를 주고받아야 하는 다양한 애플리케이션을 효율적으로 개발할 수 있습니다. 이번 글에서는 WebSocket 서버와 클라이언트를 구현하는 방법을 살펴보았으며, 이를 바탕으로 IoT, 실시간 채팅 등 다양한 프로젝트로 확장해보세요!

Related Posts

로드 중…

댓글 쓰기