🎮RIOT API 분석 프로젝트(9) - Flask를 사용하여 웹페이지 만들기

flask를 활용해 백앤드 개발

from flask import Flask, request, jsonify, render_template
import mysql.connector
import requests

app = Flask(__name__)

# MySQL 연결 설정
def get_db_connection():
    return mysql.connector.connect(
        host="localhost",
        user='root',
        password='pw',
        database='riot_game_db'
    )

# 라이엇 API URL 설정
RIOT_API_KEY = "my_api"
RIOT_API_URL = "https://asia.api.riotgames.com"

# 메인 페이지 - 유저 검색 폼을 보여줌
@app.route('/')
def index():
    return render_template('index.html')

# 닉네임 검색 및 게임 정보 조회 함수
@app.route('/search', methods=['POST'])
def search_user():
    summoner_name = request.form.get('summoner_name')

    if not summoner_name:
        return render_template('index.html', error="닉네임을 입력해주세요")

    # MySQL 연결
    connection = get_db_connection()
    cursor = connection.cursor(dictionary=True)

    try:
        # 1. duplicated_GM_users 테이블에서 puuid 조회
        cursor.execute("SELECT puuid FROM duplicated_GM_users WHERE summoner_name = %s", (summoner_name,))
        result = cursor.fetchone()

        if result:
            puuid = result['puuid']

            # 2. 라이엇 API를 사용하여 최근 5판의 게임 정보 가져오기
            match_ids = get_recent_matches(puuid, 5)

            if not match_ids:
                return render_template('index.html', error="게임 정보를 찾을 수 없습니다.")

            # 3. 매치별 상세 정보를 가져오기
            games_info = []
            for match_id in match_ids:
                match_info = get_match_info(match_id)
                if match_info:
                    games_info.append(match_info)

            # DB 연결 해제
            cursor.close()
            connection.close()

            # 4. 결과를 HTML 페이지에 전달
            return render_template('results.html', games_info=games_info, summoner_name=summoner_name)

        else:
            cursor.close()
            connection.close()
            return render_template('index.html', error="유저를 찾을 수 없습니다")
    
    except mysql.connector.Error as err:
        cursor.close()
        connection.close()
        return render_template('index.html', error=f"MySQL 오류 발생: {err}")
    except Exception as e:
        cursor.close()
        connection.close()
        return render_template('index.html', error=f"오류 발생: {e}")

# 최근 매치 ID를 가져오는 함수
def get_recent_matches(puuid, count):
    url = f"{RIOT_API_URL}/lol/match/v5/matches/by-puuid/{puuid}/ids?start=0&count={count}&api_key={RIOT_API_KEY}"

    try:
        response = requests.get(url)
        response.raise_for_status()  # 상태 코드가 200이 아니면 예외 발생

        if response.status_code == 200:
            return response.json()  # 매치 ID 리스트 반환
        elif response.status_code == 404:
            print("매치 ID를 찾을 수 없습니다.")
            return []
        elif response.status_code == 429:
            print("API 요청 제한이 초과되었습니다. 잠시 후 다시 시도하세요.")
            return []
        else:
            print(f"알 수 없는 오류 발생: 상태 코드 {response.status_code}")
            return []

    except requests.exceptions.RequestException as e:
        print(f"API 요청 오류: {e}")
        return []

# 특정 매치의 게임 정보를 가져오는 함수
def get_match_info(match_id):
    url = f"{RIOT_API_URL}/lol/match/v5/matches/{match_id}?api_key={RIOT_API_KEY}"

    try:
        response = requests.get(url)
        response.raise_for_status()  # 상태 코드가 200이 아니면 예외 발생

        if response.status_code == 200:
            match_data = response.json()
            return extract_player_data(match_data)
        else:
            print(f"매치 정보 가져오기 실패, 상태 코드: {response.status_code}")
            return None

    except requests.exceptions.RequestException as e:
        print(f"API 요청 오류: {e}")
        return None

# 플레이어 정보 추출 (게임 정보에서 필요한 데이터만 가져오기)
def extract_player_data(match_data):
    for participant in match_data['info']['participants']:
        player_info = {
            'kills': participant['kills'],
            'deaths': participant['deaths'],
            'gold_earned': participant['goldEarned'],
            'wards_placed': participant['wardsPlaced'],
            'wards_bought': participant['visionWardsBoughtInGame'],
            'css': participant['totalMinionsKilled'],
            'assists': participant['assists'],
            'kda': participant['challenges']['kda'] if 'challenges' in participant else None,
            'teamPosition': participant['teamPosition']
        }
        return player_info

if __name__ == '__main__':
    app.run(debug=True)

 

코드에 대한 설명은 이전 글(7)에 나와있을테니 확인해주시면 됩니다!

 

 

검색할 페이지 HTML 생성

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Game Stats Search</title>
</head>
<body>
    <h1>소환사 닉네임으로 게임 정보 검색</h1>
    <form action="/search" method="post">
        <label for="summoner_name">닉네임:</label>
        <input type="text" id="summoner_name" name="summoner_name" required>
        <button type="submit">검색</button>
    </form>

    {% if error %}
        <p style="color:red;">{{ error }}</p>
    {% endif %}
</body>
</html>

 

 

검색결과 페이지 HTML 생성

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>{{ summoner_name }}의 최근 5판 게임 정보</title>
</head>
<body>
    <h1>{{ summoner_name }}의 최근 5판 게임 정보</h1>
    
    {% if games_info %}
        <table border="1">
            <thead>
                <tr>
                    <th>킬</th>
                    <th>데스</th>
                    <th>골드 획득</th>
                    <th>와드 배치</th>
                    <th>와드 구매</th>
                    <th>CS</th>
                    <th>어시스트</th>
                    <th>KDA</th>
                    <th>팀 포지션</th>
                </tr>
            </thead>
            <tbody>
                {% for game in games_info %}
                <tr>
                    <td>{{ game.kills }}</td>
                    <td>{{ game.deaths }}</td>
                    <td>{{ game.gold_earned }}</td>
                    <td>{{ game.wards_placed }}</td>
                    <td>{{ game.wards_bought }}</td>
                    <td>{{ game.css }}</td>
                    <td>{{ game.assists }}</td>
                    <td>{{ game.kda }}</td>
                    <td>{{ game.teamPosition }}</td>
                </tr>
                {% endfor %} <!-- 닫힘 -->
            </tbody>
        </table>
    {% else %}
        <p>게임 정보를 찾을 수 없습니다.</p>
    {% endif %}

    <a href="/">다른 유저 검색</a>
</body>
</html>

 

 

 

 

완성된 사이트에 유저 닉네임 검색하기

 

페이커님의 닉네임으로 검색해봤습니다!

잘 나옵니다~!

 

이제 DB에 있는 자료를 태블로와 연동해서 시각화 한 다음 웹페이지에 구현하겠습니다!