[파이썬] Flask를 이용한 웹소켓 통신

01 Sep 2023

python

웹소켓은 실시간으로 양방향 통신을 할 수 있는 프로토콜입니다. 이를 이용하여 실시간 채팅, 실시간 게임 등 다양한 애플리케이션을 개발할 수 있습니다. 이번 포스트에서는 Flask를 이용하여 웹소켓 통신을 구현하는 방법에 대해 알아보겠습니다.

Flask-SocketIO

Flask-SocketIO는 Flask 애플리케이션에서 웹소켓 통신을 구현할 수 있도록 도와주는 라이브러리입니다. 다음과 같이 Flask-SocketIO를 설치할 수 있습니다.

pip install flask-socketio

예제 코드

다음은 Flask를 이용하여 간단한 채팅 애플리케이션을 구현한 예제 코드입니다.

from flask import Flask, render_template
from flask_socketio import SocketIO, emit

app = Flask(__name__)
app.config['SECRET_KEY'] = 'secretkey'
socketio = SocketIO(app)

@app.route('/')
def index():
    return render_template('index.html')

@socketio.on('message')
def handle_message(message):
    emit('message', message, broadcast=True)

if __name__ == '__main__':
    socketio.run(app)

위 코드에서는 Flask-SocketIO를 이용하여 / 경로에 연결된 클라이언트들 간에 메시지를 주고받을 수 있습니다.

HTML 템플릿

위 예제 코드에서는 index.html 파일을 렌더링하는 것을 볼 수 있습니다. 이 파일은 간단한 채팅 화면을 구현하기 위한 HTML 템플릿입니다.

<!DOCTYPE html>
<html>
<head>
    <title>채팅 애플리케이션</title>
</head>
<body>
    <ul id="messages"></ul>
    <input id="input" type="text" autocomplete="off" />
    <button id="send">전송</button>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/3.1.3/socket.io.js"></script>
    <script>
        var socket = io();
        var input = document.getElementById("input");
        var sendButton = document.getElementById("send");
        var messages = document.getElementById("messages");

        sendButton.onclick = function() {
            var message = input.value;
            if (message.trim() !== '') {
                socket.emit("message", message);
                input.value = '';
            }
        };

        socket.on("message", function(message) {
            var li = document.createElement("li");
            li.innerHTML = message;
            messages.appendChild(li);
        });
    </script>
</body>
</html>

위 템플릿은 간단한 채팅창을 구현하기 위해 필요한 요소들을 포함하고 있습니다.

실행하기

위 코드와 템플릿 파일을 작성한 뒤, 다음 명령어를 실행하여 Flask 애플리케이션을 실행할 수 있습니다.

python app.py

애플리케이션을 실행한 후 웹 브라우저에서 http://localhost:5000에 접속하면 채팅 애플리케이션을 사용할 수 있습니다.

마무리

이번 포스트에서는 Flask를 이용하여 웹소켓 통신을 구현하는 방법에 대해 알아보았습니다. Flask-SocketIO의 간편한 인터페이스를 통해 실시간 통신을 구현할 수 있으며, 이를 활용하여 다양한 실시간 애플리케이션을 개발할 수 있습니다.