파일의 문지기, Storage 보안 규칙 ✦ Storage 셋업 #2

안녕하세요! ARCOA 지안입니다. 👋 

지난 글에서 Storage를 생성하고 첫 이미지를 업로드했죠. 프로덕션 모드로 시작했다면 지금은 모든 접근이 차단된 상태예요.

 

Firestore와 마찬가지로, 프로덕션 모드의 기본 규칙은 "모두 차단"이에요.

앱이 이미지를 읽으려면 보안 규칙을 작성해야 합니다.

 

이번 글에서는:

✦ Firestore와 Storage 규칙의 차이점

✦ Storage만의 파일 크기/타입 제한

✦ 폴더별 권한 설정 실습

 

만약, 보안 규칙이 처음이라면, DB의 문지기, 보안 규칙 작성 ✦ Firestore 셋업 #4을 먼저 시작해보세요!

소요 시간: 15분 ⏱️

 

 

 

Step 1. Storage 보안 규칙 접근

1-1. Firestore vs Storage 규칙 차이점

구조는 거의 같지만, Storage만의 특별한 기능이 있어요.

구분	Firestore	Storage
대상	문서(document)	파일(file)
경로 예시	/card_master/{cardId}	/images/cards/{fileName}
서비스 선언	cloud.firestore	firebase.storage
추가 기능	-	파일 크기, 타입 제한

 

💡 핵심: Storage는 파일 크기와 파일 타입을 규칙으로 제한 가능!

 

 

 

Step 2. Storage 전용 조건

2-1. 파일 크기 제한

request.resource.size < 5 * 1024 * 1024   // 5MB 이하

 

2-2. 파일 타입 제한

// 모든 이미지 허용
request.resource.contentType.matches('image/.*')

// 특정 타입만 허용
request.resource.contentType == 'image/webp'

 

2-3. 자주 쓰는 contentType

타입	값
모든 이미지	image/.*
WebP	image/webp
JPG	image/jpeg
PNG	image/png
PDF	application/pdf

 

 

 

Step 3. 실전 규칙 템플릿

3-1. 폴더별 권한 전략 예시

폴더	읽기	쓰기	이유
/images/**	모두 허용	차단	서비스 이미지 (Static)
/users/{userId}/**	본인만	본인만	프로필, 개인 파일

 

3-2. 전체 규칙 (복사용)

rules_version = '2';
service firebase.storage {
  match /b/{bucket}/o {
    
    // images: 누구나 읽기, 쓰기 차단
    match /images/{allPaths=**} {
      allow read: if true;
      allow write: if false;
    }
    
    // users: 본인만 읽기/쓰기 + 파일 제한
    match /users/{userId}/{allPaths=**} {
      allow read: if request.auth != null 
                  && request.auth.uid == userId;
      allow write: if request.auth != null 
                   && request.auth.uid == userId
                   && request.resource.size < 5 * 1024 * 1024
                   && request.resource.contentType.matches('image/.*');
    }
    
    // 그 외 모든 경로 차단
    match /{allPaths=**} {
      allow read, write: if false;
    }
  }
}

 

3-3. 규칙 설명

images 폴더 — Static 이미지용

• allow read: if true → 누구나 이미지 볼 수 있음
• allow write: if false → 업로드/삭제 불가 (Console에서만 관리)

users 폴더 — 사용자 업로드용

• request.auth.uid == userId → 본인 폴더만 접근
• size < 5 * 1024 * 1024 → 크기 제한
• contentType.matches('image/.*') → 이미지 파일만

 

3-4. Gemini AI 활용하기

Firestore처럼 Storage Rules에서도 Gemini가 도와줘요.

• "이 규칙 설명해줘"
• "PDF 파일도 허용하게 수정해줘"
• "파일 크기를 10MB로 바꿔줘"

 

 

 

Step 4. 테스트 및 배포

4-1. 규칙 붙여넣기

• Storage → Rules 탭
• 규칙 붙여넣기 → 게시 클릭

 

4-2. Rules Playground로 테스트

테스트 1: images 폴더 읽기 (성공해야 함)

• Simulation type: get
• Location: images/cards/card_01.webp
• Authenticated: Off
• 실행 → ✅ 초록색 성공

테스트 2: images 폴더 쓰기 (실패해야 함)

• Simulation type: create
• Location: images/cards/new_card.webp
• Authenticated: Off
• 실행 → ❌ 빨간색 거부 (정상!)

 

4-3. 배포 확인

• "규칙이 게시되었습니다" 메시지 확인
• 새 요청에는 최대 1분 후 적용

 

 

 

✅ 완료 체크리스트

[  ] Firestore vs Storage 규칙 차이 이해

[  ] 파일 크기/타입 제한 방법 이해

[  ] 폴더별 규칙 템플릿 적용

[  ] Rules Playground 테스트 완료

[  ] 규칙 게시 완료

 

 

 

디자이너를 위한 요약

Firestore는 데이터를, Storage는 파일을 지킨다.
Storage는 크기와 타입까지 제한할 수 있다.

 

 

 

🎉 Storage 셋업 완료!

✦ 디자이너(비개발자)를 위한 Storage 셋업 

├ 1 ✦ Storage 설정과 첫 이미지 업로드 완료 

└ 2 ✦ 파일의 문지기, Storage 보안 규칙 완료 

 

다음 시리즈

Firebase의 인증(Auth), 데이터(Firestore), 파일(Storage)까지 모두 준비됐어요.

드디어! FlutterFlow에서 실제 앱 화면과 연결할 차례입니다 ✦

 

✦ 디자이너(비개발자)를 위한 FlutterFlow 시작하기 

├ 1 ✦ 프로젝트 생성과 초기 설정 
├ 2 ✦ Firebase 연동하기 
├ 3 ✦ 테마 & 디자인 시스템 
├ 4 ✦ 페이지 생성 & 네비게이션 
└ 5 ✦ 기본 UI 위젯 활용