웹상에서 webp 파일을 jpg로 변환해주는 웹앱 만들기
https://chatgpt-lab.tistory.com/26
webp 파일을 jpg 파일로 변환하는 파이썬 코드
webp 파일을 jpg 파일로 변환하는 파이썬 코드 from PIL import Image import os # 원본 이미지가 저장된 폴더 경로 input_dir = './input/' # 변환된 이미지를 저장할 폴더 경로 output_dir = './output/' # output_dir 폴더가
chatgpt-lab.tistory.com
오늘은 지난포스트에서 제작한 webp파일을 jpg 변환해주는 파이썬 코드를
바탕으로 웹상에서 webp 파일을 jpg로 변환해주는 웹앱을 만들어 보았습니다.
모든 작업은 chatGPT에게 의뢰하여 10여 차례 정도 수정하며 최종 완성 되었습니다.
웹 버젼에서 추가된 기능은 업로드 후 추가 업로드 기능과 한번 업로드 후에는 파일 자동 삭제되도록 하였습니다.
최종 수정된 코드 (app.py):
from flask import Flask, request, render_template, send_file
from PIL import Image
import os
app = Flask(__name__)
# 파일 업로드 폴더
UPLOAD_FOLDER = 'uploads/'
OUTPUT_FOLDER = 'output/'
app.config['UPLOAD_FOLDER'] = UPLOAD_FOLDER
app.config['OUTPUT_FOLDER'] = OUTPUT_FOLDER
# 업로드 폴더가 없으면 생성
if not os.path.exists(UPLOAD_FOLDER):
os.makedirs(UPLOAD_FOLDER)
if not os.path.exists(OUTPUT_FOLDER):
os.makedirs(OUTPUT_FOLDER)
def clear_previous_files():
# 이전 업로드된 파일과 변환된 파일 모두 삭제
for folder in [UPLOAD_FOLDER, OUTPUT_FOLDER]:
for filename in os.listdir(folder):
file_path = os.path.join(folder, filename)
if os.path.isfile(file_path):
os.remove(file_path)
@app.route('/')
def index():
return render_template('index.html', download_link=None)
@app.route('/upload', methods=['POST'])
def upload_file():
# 이전 파일 삭제
clear_previous_files()
if 'file' not in request.files:
return 'No file part'
file = request.files['file']
if file.filename == '':
return 'No selected file'
if file and file.filename.endswith('.webp'):
# 파일 저장
input_path = os.path.join(app.config['UPLOAD_FOLDER'], file.filename)
file.save(input_path)
# 이미지 변환
img = Image.open(input_path)
img = img.convert('RGB')
output_filename = os.path.splitext(file.filename)[0] + '.jpg'
output_path = os.path.join(app.config['OUTPUT_FOLDER'], output_filename)
img.save(output_path)
# 변환 후 업로드 폼과 다운로드 링크를 렌더링
return render_template('index.html', download_link=output_filename)
else:
return 'Only webp files are allowed'
@app.route('/download/<filename>')
def download_file(filename):
output_path = os.path.join(app.config['OUTPUT_FOLDER'], filename)
return send_file(output_path, as_attachment=True)
if __name__ == "__main__":
app.run(host="0.0.0.0", port=5000, debug=True)
HTML 파일 (index.html):
이 HTML 파일에서는 업로드 폼과 다운로드 링크를 함께 표시할 수 있도록 구성합니다.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>WebP to JPG Converter</title>
</head>
<body>
<h1>WebP to JPG Converter</h1>
<!-- 파일 업로드 폼 -->
<form method="post" action="/upload" enctype="multipart/form-data">
<label for="file">Choose a WebP file:</label>
<input type="file" id="file" name="file" accept=".webp">
<input type="submit" value="Convert">
</form>
<!-- 변환 후 다운로드 링크가 있으면 표시 -->
{% if download_link %}
<br>
<h3>File successfully converted!</h3>
<a href="/download/{{ download_link }}">Download {{ download_link }}</a>
{% endif %}
</body>
</html>설명:
- 변환 후 이전 파일 삭제: 새 파일을 업로드할 때마다 clear_previous_files() 함수가 호출되어 기존의 파일들이 삭제됩니다.
- 업로드 후 폼과 다운로드 링크 표시: 변환이 완료되면 index.html 템플릿이 렌더링되면서 다운로드 링크와 새로운 파일을 업로드할 수 있는 폼이 동시에 표시됩니다.
- 다운로드 링크는 변환된 파일에 대한 링크로 제공되며, 사용자가 다운로드 버튼을 클릭하면 변환된 이미지를 다운로드할 수 있습니다.
이 코드를 통해 사용자 경험이 개선되고, 변환된 파일을 바로 다운로드할 수 있게 됩니다.
프로젝트 디렉토리 구조:
/my_flask_project/
├── app.py # Flask 애플리케이션이 담긴 Python 파일
└── templates/
└── index.html # 업로드 폼이 있는 HTML 파일
└── uploads/ # 업로드된 파일이 저장될 폴더 (자동 생성)
위 앱파일을 웹에서 실행하기 위해서는 Flask 애플리케이션 실행이 필수적입니다.
Flask 애플리케이션 실행에 대한 포스트는 아래의 링크에서 확인 가능합니다.
https://chatgpt-lab.tistory.com/87
웹에서 파이썬 프로그램을 운영하기 위해 Flask 애플리케이션 실행
파이썬으로 만든 프로그램을 웹상에서 운영하기 위해서 사용한 Flask 애플리케이션 실행방법입니다. 서버에서 Python 및 Flask 설정서버에서 Flask 애플리케이션을 실행하기 위해 Python 및 Flask가 설
chatgpt-lab.tistory.com