ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • ๐Ÿค” Firebase API Key๋ฅผ ๊ณต๊ฐœํ•˜๋Š” ๊ฒƒ์ด ์•ˆ์ „ํ•ฉ๋‹ˆ๊นŒ?
    Firebase 2021. 1. 8. 15:33

    ๐Ÿ“Œ ๊ณ ๋ฏผํ•˜๊ฒŒ ๋œ ๊ณ„๊ธฐ

    • ์Šคํ„ฐ๋”” ๋ชจ์ง‘ ๊ฐœ์ธ ํ”„๋กœ์ ํŠธ๋ฅผ ์ง„ํ–‰ํ•˜๋ฉด์„œ ๋ฐฑ์•ค๋“œ๋กœ firebase๋ฅผ ์‚ฌ์šฉํ•˜๊ฒŒ ๋˜์—ˆ์Šต๋‹ˆ๋‹ค.
    • ์‚ฌ์šฉํ•˜๋ฉด์„œ API Key์ด๋‹ˆ๊นŒ ๋‹น์—ฐํžˆ .env ํŒŒ์ผ๋กœ ๊ด€๋ฆฌํ•ด์•ผ์ง€๋ผ๊ณ  ์ƒ๊ฐํ•œ ๋’ค ๊ด€๋ฆฌ๋ฅผ ํ•˜๊ฒŒ ๋˜์—ˆ๊ณ , ๊ทธ ํ›„ Ci/Cd๋ฅผ ์œ„ํ•ด Github-Action ์‚ฌ์šฉํ•˜๊ณ  ์žˆ์—ˆ๊ณ  CI๋ฅผ ์ง„ํ–‰ํ•˜๋ฉด์„œ .envํŒŒ์ผ๋กœ ์ธํ•ด ํ…Œ์ŠคํŠธ๊ฐ€ ๊นจ์ง€๋Š” ํ˜„์ƒ์ด ๋ฐœ์ƒํ•˜๊ฒŒ ๋˜์—ˆ์Šต๋‹ˆ๋‹ค.
      ํ…Œ์ŠคํŠธ๋ฅผ ํ•  ๋•Œ apikey๋ฅผ ์‚ฌ์šฉํ•˜๋Š” ๋ถ€๋ถ„์„ mockingํ•ด์„œ ํ• ๋ ค๊ณ  ํ–ˆ์—ˆ๊ณ  ๊ณ ๋ฏผ์„ ํ•ด๋ณด์•˜์ง€๋งŒ ์‰ฝ๊ฒŒ ์ง„ํ–‰๋˜์ง€ ์•Š์•˜์Šต๋‹ˆ๋‹ค.
    FIREBASE_API_KEY= "your api-key"
    FIREBASE_AUTH_DOMAIN = "your auth-domain"
    FIREBASE_DATA_BASEURL = "your data-baseurl"
    FIREBASE_PROJECT_ID = "your project-id"
    FIREBASE_STORAGE_BUCKET = "your storage-bucket"
    FIREBASE_MESSAGING_SENDER_ID = "your messaging-sender-id"
    FIREBASE_APP_ID = "your app-id"
    FIREBASE_MEASUREMENT_ID = "your measurement-id"
    • ๊ทธ๋ ‡๋‹ค๊ฐ€ ์šฐ์—ฐ์น˜์•Š๊ฒŒ Is it safe to expose Firebase apiKey to the public?๋ผ๋Š” ์ œ๋ชฉ์˜ ์ฃผ์ œ๋กœ api ํ‚ค๋ฅผ ๊ณต๊ฐœํ•˜๋Š” ๊ฒƒ์ด ์•ˆ์ „ํ•œ์ง€์— ๋Œ€ํ•œ ์Šคํƒ ์˜ค๋ฒ„ํ”Œ๋กœ์šฐ์˜ ์งˆ๋ฌธ์ด ๋ˆˆ์— ๋“ค์–ด์˜ค๊ฒŒ ๋˜์—ˆ์Šต๋‹ˆ๋‹ค.
      ๊ทธ๋ฆฌ๊ณ  ์ด ๋ถ€๋ถ„์— ๋Œ€ํ•ด์„œ ๊ณ„์† ๊ณ ๋ฏผํ•˜๊ฒŒ ๋˜์—ˆ๊ณ , ๋‹ต์€ ์ € ๊ธ€์— ๋ช…ํ™•ํžˆ ๋‚˜์™€์žˆ์ง€๋งŒ API Key๋ผ๋Š” ์ ์ด ๊ฑธ๋ ค ์ œ๊ฐ€ ์•Œ๊ฒŒ๋œ ์‚ฌ์‹ค์„ ์ ์–ด ๊ณต์œ ํ•ด๋ณผ๊นŒ ํ•ฉ๋‹ˆ๋‹ค.

    ๐Ÿ’จ Is it safe to expose Firebase apiKey to the public?

    • ๊ณ ๋ฏผ์˜ ๋ฐœ๋‹จ์ด ๋œ ์Šคํƒ์˜ค๋ฒ„ํ”Œ๋กœ์šฐ์˜ ์งˆ๋ฌธ๋Š” ์ œ๋ชฉ ๊ทธ๋Œ€๋กœ firebase apikey๋ฅผ ๊ณต๊ฐœ๋ฅผ ํ•˜๋Š” ๊ฒƒ์ด ์•ˆ์ „ํ•œ์ง€์— ๋Œ€ํ•ด์„œ ๋ฌผ์–ด๋ณธ ๊ฒƒ์ด์˜€์Šต๋‹ˆ๋‹ค.
      ๊ทธ ์งˆ๋ฌธ์˜ ๋‹ต๋ณ€์€ Google์˜ Firebase ์—”์ง€๋‹ˆ์–ด๋ถ„์ด ๋‹ฌ์•„์ฃผ์…จ๋Š”๋ฐ ๊ทธ ๋‹ต์€ ๋‹ค์Œ๊ณผ ๊ฐ™์•˜์Šต๋‹ˆ๋‹ค.
    • apiKey๋Š” Google ์„œ๋ฒ„์—์„œ Firebase ํ”„๋กœ์ ํŠธ๋งŒ ์‹๋ณ„ํ•ฉ๋‹ˆ๋‹ค. ๋ˆ„๊ตฐ๊ฐ€๊ฐ€ ๊ทธ๊ฒƒ์„ ์•„๋Š” ๊ฒƒ์€ ๋ณด์•ˆ ์œ„ํ—˜์ด ์•„๋‹™๋‹ˆ๋‹ค. ์‚ฌ์‹ค, ๊ทธ๋“ค์ด ๋‹น์‹ ์˜ Firebase ํ”„๋กœ์ ํŠธ์™€ ์ƒํ˜ธ ์ž‘์šฉํ•˜๊ธฐ ์œ„ํ•ด์„œ๋Š” ๊ทธ๋“ค์ด ๊ทธ๊ฒƒ์„ ์•Œ์•„์•ผํ•ฉ๋‹ˆ๋‹ค. ์ด ๋™์ผํ•œ ๊ตฌ์„ฑ ๋ฐ์ดํ„ฐ๋Š” Firebase๋ฅผ ๋ฐฑ์—”๋“œ๋กœ ์‚ฌ์šฉํ•˜๋Š” ๋ชจ๋“  iOS ๋ฐ Android ์•ฑ์—๋„ ํฌํ•จ๋ฉ๋‹ˆ๋‹ค.
    • Firebase ๋ฐฑ์—”๋“œ ์„œ๋น„์Šค์— ๋Œ€ํ•œ ๋ชจ๋“  ๋ฐ์ดํ„ฐ ์•ก์„ธ์Šค๋ฅผ ์Šน์ธํ•˜๋Š” ๋ฐฉ๋ฒ•์„ ์•Œ์•„ ๋ณด๋ ค๋ฉด Firebase ๋ณด์•ˆ ๊ทœ์น™์— ๋Œ€ํ•œ ๋ฌธ์„œ๋ฅผ ์ฝ์–ด ๋ณด์„ธ์š”. ์ด๋Ÿฌํ•œ ๊ทœ์น™์€ ํŒŒ์ผ ์ €์žฅ์†Œ ๋ฐ ๋ฐ์ดํ„ฐ๋ฒ ์ด์Šค ์•ก์„ธ์Šค์— ๋Œ€ํ•œ ์•ก์„ธ์Šค๋ฅผ ์ œ์–ดํ•˜๋ฉฐ Firebase ์„œ๋ฒ„์— ์ ์šฉ๋ฉ๋‹ˆ๋‹ค.
    • ์ด๋Ÿฌํ•œ ๋‹ต๋ณ€์œผ๋กœ ๊ฒฐ๋ก ์€ Firebase์˜ API-Key๋Š” Google ์„œ๋ฒ„์—์„œ firebase ํ”„๋กœ์ ํŠธ๋งŒ ์‹๋ณ„ํ•˜๊ธฐ ๋•Œ๋ฌธ์— ๋ณด์•ˆ์— ๋ฌธ์ œ๊ฐ€ ๋˜์ง€ ์•Š๋Š”๋‹ค๋Š” ๋ช…ํ™•ํ•œ ๋‹ต๋ณ€์ด์˜€์Šต๋‹ˆ๋‹ค. ํ•˜์ง€๋งŒ, ๊ทธ ์งˆ๋ฌธ์˜ ๊ธ€์€ ๋ฌด๋ ค 5๋…„ ์ „ ์งˆ๋ฌธ์ด์—ˆ๊ณ  API-key์— ๋Œ€ํ•œ ์˜์‹ฌ์€ ์žˆ์–ด์„œ ๋” ์ฐพ์•„๋ณด๊ฒŒ ๋˜์—ˆ์Šต๋‹ˆ๋‹ค.

    ๐Ÿฃ Firebase ๊ณต์‹ ๋ฌธ์„œ

    • Firebase์˜ ๊ณต์‹ ๋ฌธ์„œ์—์„œ Firebase ์šฉ API ํ‚ค ์‚ฌ์šฉ ๋ฐ ๊ด€๋ฆฌ์— ๋Œ€ํ•ด ์•Œ์•„๋ณด๊ธฐ๋ผ๋Š” ์ œ๋ชฉ์œผ๋กœ Api key์˜ ๊ด€๋ฆฌ ๋ฐฉ๋ฒ•์ด ์ž์„ธํžˆ ์„ค๋ช…๋˜์–ด์žˆ์Šต๋‹ˆ๋‹ค.
    • ์—ฌ๊ธฐ์„œ๋„ ์•„๋ž˜์™€ ๊ฐ™์ด Firebase์šฉ APIํ‚ค๋Š” ์ผ๋ฐ˜์ ์ธ APIํ‚ค์™€ ๋‹ค๋ฅด๊ธฐ ๋•Œ๋ฌธ์— APIํ‚ค๊ฐ€ ์ผ๋ฐ˜์ ์œผ๋กœ ์‚ฌ์šฉ๋˜๋Š” ๋ฐฉ์‹๊ณผ ๋‹ฌ๋ฆฌ Firebase ์„œ๋น„์Šค์šฉ APIํ‚ค๋Š” ๋ฐฑ์—”๋“œ ๋ฆฌ์†Œ์Šค์— ๋Œ€ํ•œ ์•ก์„ธ์Šค๋ฅผ ์ œ์–ดํ•˜๋Š” ๋ฐ ์‚ฌ์šฉ ๋˜์ง€ ์•Š์Šต๋‹ˆ๋‹ค. ๋ผ๋Š” ๋‚ด์šฉ์ด ์ ํ˜€์žˆ์—ˆ์Šต๋‹ˆ๋‹ค.

    • ํ•˜์ง€๋งŒ ์ œ๊ฐ€ ์ง„ํ–‰ํ•˜๊ณ  ์žˆ๋˜ ๊ฐœ์ธ ํ”„๋กœ์ ํŠธ๋Š” ์ด๋ฉ”์ผ/๋น„๋ฐ€๋ฒˆํ˜ธ ๋กœ๊ทธ์ธ ๋ฐฉ๋ฒ•์œผ๋กœ Firebase ์ธ์ฆ์„ ์‚ฌ์šฉํ•˜๋Š” ๊ฒฝ์šฐ์— ํ•ด๋‹นํ•˜์˜€๊ธฐ ๋•Œ๋ฌธ์— APIํ‚ค์— ์ œํ•œ์„ ์ ์šฉํ•ด์•ผํ•˜๋Š” ๊ตฌ์ฒด์ ์ธ ๊ฒฝ์šฐ์— ํ•ด๋‹นํ•˜๊ฒŒ ๋˜์—ˆ์Šต๋‹ˆ๋‹ค.
    • ๋˜ํ•œ, ๋‹ค๋ฅธ ๊ตฌ์ฒด์ ์ธ ๊ฒฝ์šฐ๋Š” ๊ณต์‹ ๋ฌธ์„œ ์ฐธ๊ณ ํ•˜์‹œ๊ธธ ๋ฐ”๋ž๋‹ˆ๋‹ค.

    ๐Ÿ“š Firebase ๋ณด์•ˆ ๊ทœ์น™

    • ๊ณต์‹ ๋ฌธ์„œ์˜ ๋‚ด์šฉ์— ๋”ฐ๋ผ ์•”ํ˜ธ ๊ธฐ๋ฐ˜ ์ธ์ฆ์„ ์‚ฌ์šฉํ•  ๋•Œ ๋ณดํ˜ธํ•˜๋Š” ๋ฐฉ๋ฒ•์ธ firebase ๋ณด์•ˆ ๊ทœ์น™์„ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.
      ๋ณด์•ˆ ๊ทœ์น™์„ ์ž˜ ์ ์šฉํ•˜๋ฉด ๋ณด์•ˆ ๊ทœ์น™์— ์˜ํ•ด ๋ณดํ˜ธ๋˜๋Š” ํ•œ ํ”„๋กœ์ ํŠธ์˜ ๋ฐ์ดํ„ฐ๋ฒ ์ด์Šค ๋˜๋Š” ์ €์žฅ์†Œ ๋ฐ์ดํ„ฐ๊ฒŒ ์—‘์„ธ์Šค ํ•  ์ˆ˜ ์—†๊ฒŒ ๋ฉ๋‹ˆ๋‹ค.
    • ๊ณต์‹ ๋ฌธ์„œ์˜ ๋ณด์•ˆ ๊ทœ์น™์— ๊ต‰์žฅํžˆ ์ž์„ธํžˆ ์„ค๋ช…์ด ๋˜์–ด์žˆ์œผ๋ฏ€๋กœ ์ฐธ๊ณ ํ•˜์‹œ๊ธฐ ๋ฐ”๋ž๋‹ˆ๋‹ค. ํŠนํžˆ ์•ˆ์ „ํ•˜์ง€ ์•Š์€ ๊ทœ์น™ ์ฐจ๋‹จ์„ ์ฐธ๊ณ ํ•˜์‹œ๋ฉด ์ข‹์„ ๊ฑฐ ๊ฐ™์Šต๋‹ˆ๋‹ค.
    • ๋งŒ์•ฝ firestore ์˜ ๋‹ค์Œ๊ณผ ๊ฐ™์€ ๊ทœ์น™์„ ์ž‘์„ฑ ํ›„ ์ ์šฉํ•ฉ๋‹ˆ๋‹ค.
    rules_version = '2';
    service cloud.firestore {
      match /databases/{database}/documents {
        match /groups/{group} {
          allow read: if true // ์ฝ๊ธฐ ๋ชจ๋‘ ํ—ˆ์šฉ
          // ์“ฐ๊ธฐ: ์ฝ˜ํ…์ธ  ์†Œ์œ ์ž ์ „์šฉ
          allow write: if request.auth != null && request.auth.uid == request.resource.data.author_uid 
        }
      }
    }

    ๋ณธ์ธ์ด ์ž‘์„ฑํ•œ ๊ฒƒ์ด ์•„๋‹Œ ๋‹ค๋ฅธ ์‚ฌ๋žŒ์ด ์ž‘์„ฑํ•œ ๊ฒƒ์„ ์ˆ˜์ •ํ• ๋ ค๊ณ  ํ•  ๊ฒฝ์šฐ ๋‹ค์Œ๊ณผ ๊ฐ™์ด ๊ถŒํ•œ์ด ์—†์–ด ๊ฑฐ๋ถ€๋˜๋Š” ์—๋Ÿฌ๋ฅผ ๋ฐœ์ƒํ•˜๊ฒŒ ๋ฉ๋‹ˆ๋‹ค.

    • ๋‹ค์Œ์€ ์ธ์ฆ๋œ ์‚ฌ์šฉ์ž๋งŒ ์“ฐ๊ธฐ
    rules_version = '2';
    service cloud.firestore {
      match /databases/{database}/documents {
        match /groups/{group} {
          allow read: if true; // ์ฝ๊ธฐ ๋ชจ๋‘ ๊ฐ€๋Šฅ
          allow write: if request.auth.uid != null; // ์“ฐ๊ธฐ ์ธ์ฆ๋œ ์‚ฌ์šฉ์ž๋งŒ
        }
      }
    }
    • ์ถ”๊ฐ€์ ์ธ ๊ทœ์น™์€ ๊ณต์‹ ๋ฌธ์„œ ์ฐธ๊ณ  ํ•˜์‹œ๊ธธ ๋ฐ”๋ž๋‹ˆ๋‹ค.

    ๐Ÿ”ฅ ๋‹ค๋ฅธ ์›น ์‚ฌ์ดํŠธ์—์„œ Firebase ํ”„๋กœ์ ํŠธ์— ์ƒ์„ฑ, ์ˆ˜์ • ๋“ฑ์„ ๋ชปํ•˜๊ฒŒ ํ•˜๋Š” ๋ฐฉ๋ฒ•

    • firebase๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ๋ฐฐํฌ๋ฅผ ํ•˜๊ฒŒ๋˜๊ณ  ๋‚ด ํ”„๋กœ์ ํŠธ์˜ ๊ณต๊ฐœ๋œ API-key๋ฅผ ์‚ฌ์šฉํ•ด์„œ ์ˆ˜์ •ํ•  ์ˆ˜ ์žˆ๋Š” ์—ฌ์ง€๊ฐ€ ์ƒ๊ธฐ๊ฒŒ ๋ฉ๋‹ˆ๋‹ค.
    • ์˜ˆ๋ฅผ ๋“ค์–ด์„œ Github์— ๊ณต๊ฐœ๋œ API-key๋ฅผ ์‚ฌ์šฉํ•ด์„œ fork ํ›„ ๋กœ์ปฌ์—์„œ ํ”„๋กœ์ ํŠธ๋ฅผ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๊ฒŒ ๋ฉ๋‹ˆ๋‹ค. (localhost) ๊ทธ๋ ‡๊ฒŒ ๋˜๋ฉด ํ•ด๋‹น ๊ตฌ์„ฑ ํŒŒ์ผ์„ ์‚ฌ์šฉํ•˜์—ฌ ์ƒˆ ์‚ฌ์šฉ์ž๋ฅผ ๋งŒ๋“ค ์ˆ˜ ์žˆ๊ฒŒ ๋˜๊ณ , ๋กœ์ปฌ์—์„œ ๊ธ€์„ ์ž‘์„ฑ, ์ˆ˜์ • ๋“ฑ์„ ํ•  ์ˆ˜๊ฒŒ ์žˆ๊ฒŒ ๋ฉ๋‹ˆ๋‹ค.
    • ์ด์— ๋Œ€ํ•œ ํ•ด๊ฒฐ ๋ฐฉ๋ฒ•์€ ๋‹ค์Œ ๋ธ”๋กœ๊ทธ์— ์ž์„ธํžˆ ๋‚˜์™€์žˆ๊ณ , ์ด ๋ถ€๋ถ„์€ firebase ๊ณต์‹ ๋ฌธ์„œ์˜ ์ถœ์‹œ ์ฒดํฌ๋ฆฌ์ŠคํŠธ ์ค‘ ํ•˜๋‚˜์˜ ๋„๋ฉ”์ธ ํ—ˆ์šฉ ๋ชฉ๋ก์„ ์ถ”๊ฐ€ํ•˜์—ฌ ๋ฌด๋‹จ ์‚ฌ์šฉ์„ ๋ฐฉ์ง€ํ•ฉ๋‹ˆ๋‹ค. ๋ผ๊ณ  ์†Œ๊ฐœ๋˜์–ด์žˆ์Šต๋‹ˆ๋‹ค. ๋˜ํ•œ, ๊ตฌ๊ธ€์˜ firebase ์—”์ง€๋‹ˆ์–ด Frank van Puffelen ๊ป˜์„œ ํ”ผ์‹ฑ ๊ณต๊ฒฉ์— ๋Œ€ํ•ด ์ด ๋ฐฉ๋ฒ•์„ ์–ธ๊ธ‰ํ•˜์…จ์Šต๋‹ˆ๋‹ค.
    1. Google Cloud Platform API ๋ฐ ์„œ๋น„์Šค์— ์ ‘์†ํ•˜์—ฌ ํ•ด๋‹น ํ”„๋กœ์ ํŠธ๋ฅผ ์„ ํƒ ํ›„ ์‚ฌ์šฉ์ž ์ธ์ฆ ์ •๋ณด ํƒญ์œผ๋กœ ์ด๋™ํ•ฉ๋‹ˆ๋‹ค.

    1. ์‚ฌ์šฉ์ž ์ธ์ฆ ์ •๋ณด ํƒญ์˜ API ํ‚ค ๋ถ€๋ถ„์˜ Browser Key (auto created by Firebase) ๋ฅผ ์„ ํƒํ•ฉ๋‹ˆ๋‹ค.

    1. ์„ ํƒ ํ›„ APIํ‚ค ์ œํ•œ ๋ฐ ์ด๋ฆ„ ๋ณ€๊ฒฝ ํŽ˜์ด์ง€๋กœ ์ด๋™ํ•˜๊ฒŒ ๋˜๋Š”๋ฐ ๊ทธ ๋ถ€๋ถ„์—์„œ ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜ ์ œํ•œ ์‚ฌํ•ญ์„ HTTP ๋ฆฌํผ๋Ÿฌ(์›น์‚ฌ์ดํŠธ) ๋ฅผ ์„ ํƒํ•ด์ค๋‹ˆ๋‹ค.

    1. ์„ ํƒํ•˜๋ฉด ์•„๋ž˜์— ์›น์‚ฌ์ดํŠธ ์ œํ•œ์‚ฌํ•ญ ํ•ญ๋ชฉ์ด ๋‚˜ํƒ€๋‚˜๊ฒŒ ๋˜๋Š”๋ฐ ๊ทธ ํ•ญ๋ชฉ์— ๋ฐฐํฌ๋˜์–ด ์žˆ๋Š” ํ•ด๋‹น ํ”„๋กœ์ ํŠธ URL๋ฅผ ์ž…๋ ฅ ํ›„ ์ €์žฅ์„ ํ•ฉ๋‹ˆ๋‹ค.

    • ์ด๋ ‡๊ฒŒ ๋ชจ๋“  ์ž‘์—…์„ ์™„๋ฃŒํ•˜๋ฉด ๋‹ค๋ฅธ ์‚ฌ์ดํŠธ์—์„œ API๋ฅผ ์‚ฌ์šฉํ•  ์ˆ˜ ์—†๊ฒŒ ๋ฉ๋‹ˆ๋‹ค. ํ•˜์ง€๋งŒ ์ด๋ ‡๊ฒŒ ํ•˜๋ฉด ๋กœ์ปฌ์—์„œ ์‚ฌ์šฉํ•  ์ˆ˜ ์—†๊ฒŒ ๋ฉ๋‹ˆ๋‹ค.
      ๋กœ์ปฌ์—์„œ ํ•ด๋‹น API๋ฅผ ๊ฐ€์ง€๊ณ  ๋กœ๊ทธ์ธ์„ ์‹œ๋„ํ•ด๋ณด์•˜์„ ๋•Œ ๋‹ค์Œ๊ณผ ๊ฐ™์ด 403 ์—๋Ÿฌ๊ฐ€ ๋‚˜ํƒ€๋‚˜๊ฒŒ ๋ฉ๋‹ˆ๋‹ค.

    • ๋กœ์ปฌ์—์„œ ํ…Œ์ŠคํŠธ ๋ฐ ๊ฐœ๋ฐœ์„ ๋ชปํ•˜๊ธฐ ๋•Œ๋ฌธ์— ์ด๋ฅผ ํ•ด๊ฒฐํ•˜๊ธฐ ์œ„ํ•ด์„œ๋Š” ์ƒˆ๋กœ์šด firebase ํ”„๋กœ์ ํŠธ๋ฅผ ์‚ฌ์šฉํ•ด์•ผ ํ•ฉ๋‹ˆ๋‹ค. ๊ฐœ๋ฐœ ๋ฐ ํ…Œ์ŠคํŠธ๋งŒ์„ ์œ„ํ•œ firebase ํ”„๋กœ์ ํŠธ๋ฅผ ์ƒ์„ฑํ•˜๊ณ  ์ƒˆ๋กญ๊ฒŒ ๋งŒ๋“  firebase ํ”„๋กœ์ ํŠธ์˜ ํ™˜๊ฒฝ ๋ณ€์ˆ˜๋ฅผ ์‚ฌ์šฉํ•ด์„œ ํ…Œ์ŠคํŠธ๋ฅผ ์ง„ํ–‰ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.
      ์•„๋ž˜์™€ ๊ฐ™์ด ๊ฐœ๋ฐœ ํ™˜๊ฒฝ์— ๋”ฐ๋ผ ํ™˜๊ฒฝ ๋ณ€์ˆ˜๋ฅผ ์„ค์ •ํ•ด์ค„ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.
    import firebase from 'firebase/app';
    
    import 'firebase/auth';
    import 'firebase/firestore';
    
    import devConfig from '../../config/dev'; // ๊ฐœ๋ฐœ ํ™˜๊ฒฝ ์„ค์ •
    import prodConfig from '../../config/prod'; // ๋ฐฐํฌ ํ™˜๊ฒฝ ์„ค์ •
    
    const config = process.env.NODE_ENV === 'production'
      ? prodConfig
      : devConfig;
    
    firebase.initializeApp(config);
    
    const fireStore = firebase.firestore;
    
    export default fireStore;

    ๐Ÿ“Œ ํ•˜์ง€๋งŒ, ์ด๋ ‡๊ฒŒ ์„ค์ •ํ•˜๋Š”๊ฑฐ์— ๋Œ€ํ•ด์„œ ๋ฐ˜๋ฐ•๋„ ์กด์žฌํ–ˆ์Šต๋‹ˆ๋‹ค.

    HTTP ๋ฆฌํผ๋Ÿฌ๊ฐ€ ๋งค์šฐ ์‰ฝ๊ฒŒ ์Šคํ‘ธํ•‘ ๋  ์ˆ˜ ์žˆ๋‹ค๋Š” ์ ์œผ๋กœ ๊ฒฐ๊ตญ ์ด๋ ‡๊ฒŒ ํ•˜๋Š” ๊ฑด ์†Œ์šฉ์ด ์—†๋‹ค๋Š” ์ ์ด์˜€๊ณ , api key๋ฅผ ๋…ธ์ถœํ•˜๊ฑฐ๋‚˜ ๋…ธ์ถœํ•˜์ง€ ์•Š๋Š” ๊ฒƒ์€ ์ค‘์š”ํ•˜์ง€ ์•Š๊ณ  ์ด ๋ฐฉ๋ฒ•์€ ์‹ค์ œ๋กœ ์ด๋Ÿฌํ•œ ๊ตฌ์„ฑ ์ •๋ณด๋Š” ๊ณต๊ฐœ ๋œ ๊ฒƒ์œผ๋กœ ๊ฐ„์ฃผ๋œ๋‹ค๋Š” ๋ง์ด์˜€์Šต๋‹ˆ๋‹ค.

    ๐Ÿš€ ๊ฒฐ๋ก 

    • ์ด๋Ÿฐ ์ €๋Ÿฐ ๋‚ด์šฉ์„ ์ฐพ์•„๋ณด์•˜์ง€๋งŒ ๊ฒฐ๊ตญ ๊ฒฐ๋ก ์€ firebase apiํ‚ค๋Š” ๊ณต๊ฐœ๊ฐ€ ๋˜๋„ ์ƒ๊ด€์ด ์—†๋‹ค๋Š” ์ ์ž…๋‹ˆ๋‹ค. ํ•˜์ง€๋งŒ, ๊ถŒํ•œ์„ ์ฃผ์–ด ๋” ์•ˆ์ „ํ•˜๊ฒŒ ๊ด€๋ฆฌํ•  ์ˆ˜ ์žˆ๋‹ค๋Š” ์ ์ž…๋‹ˆ๋‹ค.
    • .env๋กœ api-key๋ฅผ ์ˆจ๊ธฐ๋”๋ผ๋„ ์œ„์™€ ๊ฐ™์ด ๊ถŒํ•œ์ด ๊ฑฐ๋ถ€๋  ๋•Œ๋„ ๊ฒฐ๊ตญ apiํ‚ค์˜ ์ •๋ณด๊ฐ€ ๋…ธ์ถœ๋ฉ๋‹ˆ๋‹ค.

    • API๋Š” Firebals/Google ์„œ๋น„์Šค์™€ ์ƒํ˜ธ ์ž‘์šฉํ•  ๋•Œ Firebase ํ”„๋กœ์ ํŠธ๋ฅผ ์‹๋ณ„ํ•˜๋Š” ๋ฐ ์‚ฌ์šฉํ•ฉ๋‹ˆ๋‹ค. API ํ‚ค ์‚ฌ์šฉ์— ๋Œ€ํ•œ ๊ณต์‹ ๋ฌธ์„œ๋ฅผ ์ฐธ๊ณ ํ•ด์ฃผ์‹œ๋ฉด ๋ฉ๋‹ˆ๋‹ค.
    • Google์˜ Firebase JS ๋ชจ๋ฐ”์ผ ๊ฐœ๋ฐœ์ž์ธ Jorge Vergara๋ถ„๋„ ๋ฉ”์ผ๋กœ FIrebase API ํ‚ค๋ฅผ ์ˆจ๊ฒจ์•ผํ•˜๋Š๋ƒ์— ๋Œ€ํ•œ ๋ฉ”์ผ์ด ํ•œ๋‹ฌ์— 3 ~ 4๋ฒˆ์ด ์˜จ๋‹ค๊ณ  ํ•ฉ๋‹ˆ๋‹ค. ์ด ๊ธ€์—์„œ ํ•ต์‹ฌ์€ ๊ฒฐ๊ตญ ๊ณต๊ฐœ๋˜๋„ ๋ฌธ์ œ๊ฐ€ ๋˜์ง€ ์•Š๋Š”๋‹ค๋Š” ์ ์ด์˜€๊ณ , ์•„๋ž˜์™€ ๊ฐ™์ด ์“ฐ์‹  ๊ธ€์„ ๋ณด๊ณ  ํ™•์‹ ์„ ๊ฐ€์งˆ ์ˆ˜ ์žˆ๊ฒŒ๋˜์—ˆ์Šต๋‹ˆ๋‹ค.

    apiKey๋ฅผ ์•ˆ๋‹ค๋Š” ๊ฒƒ์€ ์‚ฌ๋žŒ๋“ค์ด ๋‹น์‹ ์˜ ๋ชจ๋“  ๋ฐ์ดํ„ฐ๋ฅผ ์ฆ‰์‹œ ํ•ดํ‚น ํ•  ์ˆ˜ ์žˆ๋‹ค๋Š” ๊ฒƒ์„ ์˜๋ฏธํ•˜๋Š” ๊ฒƒ์ด ์•„๋‹ˆ๋ผ ๊ทธ๋“ค์ด ๋‹น์‹ ์˜ ์•ฑ/ํ”„๋กœ์ ํŠธ์— ์—ฐ๊ฒฐํ•  ์ˆ˜ ์žˆ๋‹ค๋Š” ๊ฒƒ์„ ์˜๋ฏธํ•ฉ๋‹ˆ๋‹ค.

    • ์ด ๋‹ต๋ณ€์„ ๋“ฃ๊ณ  ๋ช…ํ™•ํ•˜๊ฒŒ ์ดํ•ดํ•  ์ˆ˜ ์žˆ์—ˆ์Šต๋‹ˆ๋‹ค. ๊ทธ๋ ‡๊ธฐ ๋•Œ๋ฌธ์— ์—ฐ๊ฒฐ์— ๋Œ€ํ•œ ๋ถ€๋ถ„์„ ์œ„์™€ ๊ฐ™์ด ํ•ด๊ฒฐํ•ด์ฃผ๋ฉด ๋ฌธ์ œ๋Š” ์—†๋‹ค๋Š” ๊ฒฐ๋ก ์„ ๋‚ด๋ ธ์Šต๋‹ˆ๋‹ค.

    ๐Ÿ™ ์ฐธ๊ณ  ๋งํฌ

    ๋Œ“๊ธ€ 2

Designed by Seungmin Sa.