[PYTHON] Flask에서 파일 업로드 및 프로필 사진 등록하기

Flask에서 파일 업로드 및 프로필 사진 등록하기

이전 글에서는 사용자 프로필 페이지를 만들어보았습니다.
이번 글에서는 Flask를 활용하여 파일 업로드 기능을 구현하고,
사용자의 프로필 사진을 저장 및 표시하는 방법을 배워보겠습니다.

✅ 파일 업로드 기능 추가
✅ 이미지 파일만 업로드 가능하도록 제한
✅ 사용자의 프로필 사진 표시

 

[PYTHON] Flask에서 사용자 프로필 페이지 만들기

 

---

1. 파일 업로드를 위한 환경 설정

파일을 업로드하기 위해 Flask에서 제공하는 Flask-Uploads 또는 Flask 자체 기능을 사용할 수 있습니다.
이 글에서는 기본적인 Flask의 request.files 기능을 사용하겠습니다.

📌 필요한 라이브러리 설치

pip install flask werkzeug

📌 업로드된 파일을 저장할 폴더 설정 (config.py)

import os

UPLOAD_FOLDER = "static/uploads"
ALLOWED_EXTENSIONS = {"png", "jpg", "jpeg", "gif"}

if not os.path.exists(UPLOAD_FOLDER):
    os.makedirs(UPLOAD_FOLDER)

✅ UPLOAD_FOLDER = "static/uploads" → 업로드된 파일이 저장될 폴더 설정
✅ ALLOWED_EXTENSIONS → 업로드 가능한 파일 확장자 제한
✅ os.makedirs(UPLOAD_FOLDER) → 폴더가 없으면 자동 생성

---

2. Flask에서 파일 업로드 기능 구현

📌 파일 업로드 허용 확장자 검사 함수 (app.py)

from flask import Flask, render_template, request, redirect, url_for, session
import os
from werkzeug.utils import secure_filename

app = Flask(__name__)
app.config.from_pyfile("config.py")

def allowed_file(filename):
    return "." in filename and filename.rsplit(".", 1)[1].lower() in app.config["ALLOWED_EXTENSIONS"]

✅ secure_filename(filename) → 파일명 안전하게 변경
✅ filename.rsplit(".", 1)[1].lower() → 확장자 확인

---

3. 프로필 사진 업로드 기능 추가

📌 파일 업로드 라우트 (app.py)

@app.route("/upload", methods=["GET", "POST"])
def upload_file():
    if "user" not in session:
        return redirect(url_for("login"))

    if request.method == "POST":
        if "file" not in request.files:
            return "파일이 없습니다!", 400
        
        file = request.files["file"]
        if file.filename == "":
            return "파일을 선택하세요!", 400

        if file and allowed_file(file.filename):
            filename = secure_filename(session["user"] + "." + file.filename.rsplit(".", 1)[1].lower())
            file_path = os.path.join(app.config["UPLOAD_FOLDER"], filename)
            file.save(file_path)

            # DB에 저장 (사용자의 프로필 이미지 파일명)
            conn = get_db_connection()
            cursor = conn.cursor()
            cursor.execute("UPDATE users SET profile_pic = ? WHERE username = ?", (filename, session["user"]))
            conn.commit()
            conn.close()

            return redirect(url_for("profile"))

    return render_template("upload.html")

✅ session["user"] + "." + 확장자 → 각 사용자별로 고유한 파일명 사용
✅ file.save(file_path) → 파일 저장
✅ UPDATE users SET profile_pic = ? WHERE username = ? → DB에 파일명 저장

---

📌 업로드 페이지 템플릿 (templates/upload.html)

{% extends "base.html" %}

{% block title %}프로필 사진 업로드{% endblock %}

{% block content %}
<div class="container">
    <h2>프로필 사진 업로드</h2>
    <form method="POST" enctype="multipart/form-data">
        <div class="mb-3">
            <input type="file" name="file" class="form-control" accept="image/*" required>
        </div>
        <button type="submit" class="btn btn-primary">업로드</button>
    </form>
</div>
{% endblock %}

✅ enctype="multipart/form-data" → 파일 업로드를 위해 필요
✅ accept="image/*" → 이미지 파일만 선택 가능

---

4. 프로필 페이지에서 사진 표시

📌 프로필 페이지 수정 (templates/profile.html)

{% extends "base.html" %}

{% block title %}프로필{% endblock %}

{% block content %}
<div class="container">
    <h2>프로필 정보</h2>
    <div class="text-center">
        {% if user["profile_pic"] %}
            <img src="{{ url_for('static', filename='uploads/' + user['profile_pic']) }}" class="rounded-circle" width="150">
        {% else %}
            <img src="{{ url_for('static', filename='default.png') }}" class="rounded-circle" width="150">
        {% endif %}
    </div>
    <p><strong>아이디:</strong> {{ user["username"] }}</p>
    <p><strong>이메일:</strong> {{ user["email"] if user["email"] else "미등록" }}</p>
    <p><strong>가입일:</strong> {{ user["created_at"] }}</p>
    
    <a href="/upload" class="btn btn-primary">프로필 사진 변경</a>
</div>
{% endblock %}

✅ user["profile_pic"] → 저장된 프로필 사진 경로 표시
✅ rounded-circle → 원형 프로필 이미지 적용
✅ default.png → 프로필 사진이 없을 경우 기본 이미지 표시

---

5. 데이터베이스에 프로필 사진 정보 추가

📌 DB에 프로필 사진 컬럼 추가 (update_db.py)

conn = sqlite3.connect("users.db")
cursor = conn.cursor()

cursor.execute("""
    ALTER TABLE users ADD COLUMN profile_pic TEXT DEFAULT NULL;
""")

conn.commit()
conn.close()

위 코드를 실행하여 profile_pic 컬럼을 추가합니다.

python update_db.py

---

6. 결론

이번 글에서는 Flask에서 파일 업로드 기능을 구현하고 프로필 사진을 추가하는 방법을 배웠습니다.

✅ Flask에서 파일 업로드 구현
✅ 프로필 사진 저장 및 표시
✅ 파일 업로드 보안 처리 (허용된 확장자만 업로드 가능)

다음 글에서는 Flask에서 이메일 인증을 추가하는 방법을 배워보겠습니다! 🚀

 

 

[파이썬 자격증] COS Pro 자격증 활용 가이드: 취업, 경력 개발, 실무 적용까지

 

[PYTHON] Flask를 이용한 간단한 웹 애플리케이션 만들기