럭키스팟

실전 문제 해결 가이드

로그인
AI API수동 검토 가이드확인일 2026-07-08

이미지 업로드는 됐는데 새로고침하면 사라질 때

업로드는 성공한 듯한데 새로고침 후 파일이 없거나, 배포에서 413·권한 오류가 나는 상황을 순서대로 풉니다.

한 줄 결론

업로드는 ‘파일 하나 저장’이 아니라, 저장 위치·공개 URL·권한·용량 제한이 한 세트로 맞아야 합니다.

아래 내용은 초보 바이브코더를 위한 일반 안내입니다. 서비스·지역·약관에 따라 달라질 수 있으며, 실제 사업화·운영 전에는 해당 분야 전문가 확인이 필요합니다.

먼저 용어부터 — 그다음 실행 프롬프트

storage
이미지·파일을 저장하는 클라우드 공간
MIME
파일 종류(jpeg/png 등)를 구분하는 표시

  • Object storage

    이건 storage(파일 저장소)입니다

    이미지·파일을 서버 디스크 대신 클라우드에 두는 공간입니다. 업로드 → URL 반환.

    • 용량·MIME(파일 종류)을 서버에서 검사합니다
    • 공개 버킷인지 비공개인지 정합니다
    • 악성 실행 파일 업로드를 막습니다

    이런 곳에 · 프로필 이미지 · 업로드 가이드 · Vercel Blob/S3

    지금 할 일 · 2MB·image/jpeg만 허용하는 업로드 route 1개 만들기

    비용·주의 · GB·요청 수에 따라 과금. 대용량·반복 업로드 주의.

    AI 프롬프트 보기
    Next.js + Vercel Blob 업로드. 2MB 제한, MIME 검증, 에러 메시지, env 이름.

  • Environment variables

    이건 env(환경변수)입니다

    비밀값·설정을 코드 밖에 두는 칸입니다. 로컬은 .env.local, 배포는 Vercel Environment Variables.

    • 비밀은 Git에 커밋하지 않습니다
    • 로컬과 배포 값이 다르면 ‘로컬만 됨’이 납니다
    • 이름만 같아도 값이 비면 500이 납니다

    이런 곳에 · OAuth secret · DATABASE_URL · API Key · CRON_SECRET

    지금 할 일 · .env.example에 이름만 적고, 실제 값은 .env.local에만

    비용·주의 · 잘못된 env로 무한 재시도하면 API 비용이 늘 수 있습니다.

    AI 프롬프트 보기
    Next.js + Vercel env 점검. 로컬은 되는데 배포만 실패. 필요한 키 목록(값 제외), Production 탭 확인 순서.

바로 실행 — AI 프롬프트

Next.js 이미지 업로드를 Vercel Blob에 붙입니다. route·2MB 제한·MIME 검증·공개 URL 반환·env 이름.

막히면 다시 넣을 프롬프트

업로드 413/500. 파일 크기: [   ], MIME: [   ], provider: [   ]. CORS·권한.

이런 사람이 보면 좋음

  • 이미지 업로드/프로필 사진 기능을 처음 붙이는 사람
  • 배포 후 업로드만 실패하고 나머지는 되는 사람
  • 업로드가 되더라도 ‘나중에 사라짐/깨짐’ 문제가 있는 사람

초보자가 보통 착각하는 지점

  • 서버 파일시스템에 저장하면 영구 보관된다고 믿습니다. 배포 환경은 재시작·스케일로 파일이 사라질 수 있습니다.
  • 업로드 제한(용량/확장자/MIME)을 클라이언트만 막아도 된다고 생각합니다.
  • 업로드 URL을 공개해 두고도 괜찮다고 봅니다. 무제한 업로드는 비용/보안 사고로 이어질 수 있습니다.
  • 이미지를 원본 그대로 저장하고 리사이즈/압축은 나중에 하려다 비용·저장소가 폭주합니다.

실제 점검 체크리스트

  • 업로드 최대 크기(예: 5MB)·허용 확장자·MIME을 서버에서 검증합니다.
  • 배포 환경에서 임시 저장 폴더가 쓰기 가능한지 확인합니다(권한/경로).
  • 영구 저장이 필요하면 S3/R2/Supabase Storage 등 외부 스토리지로 저장 경로를 분리합니다.
  • 업로드 후 반환하는 ‘공개 URL’이 인증/권한 정책과 맞는지 확인합니다(전체 공개 vs 로그인만).
  • 이미지는 저장 전에 리사이즈/압축을 적용해 비용을 줄입니다.
  • 악성 파일 업로드를 막기 위해 확장자만이 아니라 실제 파일 타입을 점검합니다.

실패했을 때 보는 순서

  1. 1에러 코드를 분류합니다(413: 용량/바디 제한, 401/403: 권한, 500: 서버 처리).
  2. 2서버에서 파일이 실제로 들어오는지(멀티파트 파싱) 로그로 확인합니다.
  3. 3저장 경로가 배포에서 유효한지 확인합니다(쓰기 권한/경로).
  4. 4스토리지를 쓴다면 버킷 정책/키 권한/도메인(CORS 포함)을 확인합니다.
  5. 5이미지 변환/압축 단계에서 실패한다면 입력 크기 상한을 더 낮춥니다.
  6. 6업로드 URL이 공개라면 rate limit·서명 URL 등 보호 장치를 추가합니다.

배포 전 확인 항목

  • 업로드 상한(크기/확장자)을 서버에서 강제합니다.
  • 업로드 엔드포인트에 인증/요청 제한이 있습니다.
  • 스토리지 비용·트래픽 과금 기준을 결제 전에 적어 두었습니다.

보안·법적 주의

  • 사용자 업로드 파일은 개인정보·저작권 문제가 섞일 수 있습니다. 실제 운영 전 법무·개인정보 전문가 확인을 권합니다.
  • 공개 업로드 URL은 봇/스크립트로 악용될 수 있습니다. 인증·제한·로그를 반드시 두세요.
업로드스토리지S3R2권한용량제한