Python

【Python】第8章第12回:WebSocketを使ったリアルタイム通信

本記事では、PythonとFlaskを使用してWebSocketを使ったリアルタイム通信を実現する方法を学びます。Flask-SocketIOを用いた簡単なチャットアプリの実装を通じて、基本的な概念と技術を習得しましょう。

0. 記事の概要

この記事を読むメリット

  • リアルタイム通信の基礎を理解:WebSocketを使った通信の仕組みが分かります。
  • Flask-SocketIOの使い方を習得:Pythonでリアルタイムアプリケーションを構築するスキルを身につけます。
  • チャットアプリ開発で実践的スキルを習得:動的なWebアプリケーションの開発に挑戦できます。

この記事で学べること

  • WebSocketの基本概念と用途
  • Flask-SocketIOを用いたリアルタイム通信の実装方法
  • 簡単なリアルタイムチャットアプリの構築

1. WebSocketとは何か?

1.1 WebSocketの基本概念

WebSocketは、サーバーとクライアント間でリアルタイムな双方向通信を可能にするプロトコルです。HTTPと異なり、接続を維持したままデータの送受信が行えます。

1.2 WebSocketの用途

WebSocketは、以下のような場面で利用されます。

  • リアルタイムチャット: ユーザー同士が即座にメッセージを交換できる機能
  • 通知システム: 即時通知の実現
  • リアルタイム更新: ダッシュボードやゲームなどの動的な更新

2. Flask-SocketIOを使ったリアルタイム通信

2.1 必要なライブラリのインストール

Flask-SocketIOを使用するには、以下のコマンドでライブラリをインストールします。

# 必要なライブラリのインストール
pip install flask-socketio eventlet

2.2 簡単なリアルタイムチャットアプリの実装

# app.py
from flask import Flask, render_template
from flask_socketio import SocketIO, send

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

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

@socketio.on('message')
def handle_message(msg):
    print('メッセージを受信:', msg)
    send(msg, broadcast=True)

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

2.3 HTMLテンプレートの実装

# templates/chat.html
<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <title>リアルタイムチャット</title>
    <script src="https://cdn.socket.io/4.0.0/socket.io.min.js"></script>
    <script>
        const socket = io();
        function sendMessage() {
            const msg = document.getElementById('message').value;
            socket.send(msg);
        }
        socket.on('message', function(msg) {
            const chat = document.getElementById('chat');
            chat.innerHTML += '<p>' + msg + '</p>';
        });
    </script>
</head>
<body>
    <h1>リアルタイムチャット</h1>
    <div id="chat"></div>
    <input type="text" id="message">
    <button onclick="sendMessage()">送信</button>
</body>
</html>
動作解説
  • SocketIO: クライアントからのメッセージを受信し、全クライアントに送信。
  • HTMLテンプレート: クライアントサイドでJavaScriptを用いてリアルタイム通信を実現。
  • sendメソッド: メッセージをブロードキャストで送信。

3. 実践例:リアルタイム通知システム

3.1 通知システムの概要

リアルタイム通知システムでは、特定のイベント発生時に即座に通知を送る機能を実装します。

3.2 コード例

# 通知送信の例
@socketio.on('notify')
def handle_notification(data):
    send(data, broadcast=True)

4. 練習問題

以下の課題に挑戦してみましょう。

  1. 特定のユーザーにのみメッセージを送信する機能を実装してください。
  2. 送信されたメッセージをデータベースに保存し、過去のメッセージを表示する機能を追加してください。
  3. 複数のチャットルームを実現する機能を実装してください。

5. 練習問題の解答と解説

問1の解答例

# 特定のユーザーにメッセージを送信
@socketio.on('private_message')
def handle_private_message(data):
    recipient_session_id = data['recipient']
    socketio.emit('message', data['message'], to=recipient_session_id)

6. まとめ

本記事では、WebSocketを使ったリアルタイム通信の基礎を学びました。Flask-SocketIOを活用して、さらなる機能を実装してみましょう。