갑자기 인터넷에보면 인터넷에 확장자를 변경해주는 사이트가 있잖아요..
그래서 GPT에 이런 사이트 어떻게 하는지 알아봤습니다.
제가 바로 만드는건 어렵겠지만 광고 수입 모델로 괜찮은 것 같내요. Item 참고하세요 :)
아이폰에서 촬영한 이미지는 기본적으로 HEIC (High Efficiency Image Coding) 포맷으로 저장됩니다. 이 파일을 JPG로 변환하는 웹사이트를 만들기 위해 필요한 요소들을 정리해볼게요.
⸻
1. 필요한 기술 스택
웹사이트를 만들려면 다음 기술 스택이 필요합니다.
• 프론트엔드 (사용자 인터페이스)
• HTML, CSS, JavaScript
• 파일 업로드 UI
• 변환 진행 표시 (로딩 상태)
• 백엔드 (파일 변환 처리)
• Python (Flask, FastAPI) 또는 Node.js (Express)
• pillow, pyheif 같은 이미지 변환 라이브러리 (Python의 경우)
• 파일 저장 및 처리
• 로컬 스토리지 또는 AWS S3 같은 클라우드 스토리지
• 파일 변환 후 자동 삭제 기능 (보안 및 저장 공간 절약)
⸻
2. 기본적인 사이트 동작 흐름
1. 사용자가 HEIC 파일을 업로드합니다.
2. 서버에서 HEIC → JPG 변환을 진행합니다.
3. 변환된 파일을 사용자에게 다운로드 링크로 제공합니다.
4. 일정 시간이 지나면 파일 자동 삭제 (예: 10~30분 후).
⸻
3. HEIC → JPG 변환 기능 구현 (Python 예제)
백엔드에서는 Python의 Pillow & pyheif 라이브러리를 사용해 변환할 수 있습니다.
from flask import Flask, request, send_file
import pyheif
from PIL import Image
import os
app = Flask(__name__)
UPLOAD_FOLDER = "uploads"
os.makedirs(UPLOAD_FOLDER, exist_ok=True)
def heic_to_jpg(heic_path, jpg_path):
heif_file = pyheif.read(heic_path)
image = Image.frombytes(
heif_file.mode, heif_file.size, heif_file.data, "raw", heif_file.mode, heif_file.stride
)
image.save(jpg_path, "JPEG")
@app.route("/upload", methods=["POST"])
def upload_file():
if "file" not in request.files:
return "파일을 업로드해주세요", 400
file = request.files["file"]
if file.filename == "":
return "파일이 선택되지 않았습니다.", 400
heic_path = os.path.join(UPLOAD_FOLDER, file.filename)
jpg_path = heic_path.rsplit(".", 1)[0] + ".jpg"
file.save(heic_path)
heic_to_jpg(heic_path, jpg_path)
os.remove(heic_path) # 원본 HEIC 파일 삭제
return send_file(jpg_path, as_attachment=True)
if __name__ == "__main__":
app.run(debug=True)
⸻
4. 프론트엔드 UI
간단한 HTML & JavaScript를 이용해 파일 업로드 및 다운로드 기능을 구현할 수 있습니다.
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>HEIC to JPG 변환기</title>
</head>
<body>
<h2>아이폰 이미지 (HEIC) → JPG 변환</h2>
<input type="file" id="fileInput" accept=".heic">
<button onclick="uploadFile()">변환하기</button>
<p id="status"></p>
<script>
async function uploadFile() {
let fileInput = document.getElementById("fileInput");
if (!fileInput.files.length) {
alert("파일을 선택해주세요!");
return;
}
let formData = new FormData();
formData.append("file", fileInput.files[0]);
document.getElementById("status").innerText = "변환 중...";
let response = await fetch("/upload", {
method: "POST",
body: formData,
});
if (response.ok) {
let blob = await response.blob();
let url = window.URL.createObjectURL(blob);
let a = document.createElement("a");
a.href = url;
a.download = "converted.jpg";
document.body.appendChild(a);
a.click();
a.remove();
document.getElementById("status").innerText = "변환 완료!";
} else {
document.getElementById("status").innerText = "변환 실패!";
}
}
</script>
</body>
</html>
⸻
5. 배포하기
웹사이트를 실제 서비스로 운영하려면 서버 배포가 필요합니다.
• 로컬 개발: Flask + ngrok을 이용해 임시 URL 생성
• 클라우드 배포:
• Heroku (간단한 배포 가능)
• AWS (EC2, S3, Lambda)
• Vercel (프론트엔드 배포) + Railway or Render (백엔드 배포)
⸻
6. 확장 아이디어
이 사이트를 더 발전시키고 싶다면 다음과 같은 기능을 추가할 수도 있습니다.
✅ 다중 파일 업로드 지원
✅ 변환 후 자동 삭제 (보안 강화)
✅ 드래그 앤 드롭 기능 추가
✅ 구글 드라이브 / 아이클라우드 연동
✅ PNG, WEBP 등 추가 변환 옵션 제공
⸻
7. 결론
이렇게 하면 간단한 HEIC to JPG 변환 사이트를 만들 수 있습니다.
프론트엔드는 기본적인 HTML + JavaScript로 구성하고, 백엔드는 Flask 또는 FastAPI를 사용해 HEIC 파일을 처리하고 변환한 후 다운로드할 수 있도록 구현하면 됩니다.
추가 기능이 필요하면 말씀해 주세요!
'Develop+㈜ > - Computer.P' 카테고리의 다른 글
| SaaS와 온프레미스의 차이점은 무엇일까요? (0) | 2025.02.12 |
|---|---|
| 유튜브 & 넷플릭스 해상도별 권장 속도(Mbps) (0) | 2022.11.15 |
| 자동차 실시간 운영체제 & 인포테인먼트 (OS / RTOS / 블랙베리 QNX / OSEK / AUTOSAR / ECU / 안드로이드 오토 / 카플레이 / AGL / 웹OS 오토)[출처] 자동차 실시간 운영체제 & 인포테인먼트 (OS / RTOS / 블랙베.. (0) | 2022.09.14 |
| CSFB와 SVLTE (Circuit Switched Fall-Back & Simultaneous Voice and LTE)에 대한 설명 자료 (0) | 2022.04.25 |
| 맥북 마우스 속도 간편하게 조정방법(퍼온글) (0) | 2021.03.18 |
