๐Ÿ’ฐ Google Static Maps API ๋น„์šฉ ์ ˆ๊ฐ ๋ฐฉ์•ˆ

์„ํ˜„ยท2025๋…„ 2์›” 12์ผ

Issues

๋ชฉ๋ก ๋ณด๊ธฐ
6/8

๐Ÿ’ก ๋ฐฐ๊ฒฝ

์ตœ๊ทผ Google Workspace ๊ด€๋ จ TF๋ฅผ ์ง„ํ–‰ํ•˜๋ฉด์„œ API ๋น„์šฉ์„ ๊ฒ€ํ† ํ•˜๋˜ ์ค‘, Google Static Maps API๊ฐ€ ์ƒ๋‹นํ•œ ๋น„์šฉ์„ ์ฐจ์ง€ํ•˜๊ณ  ์žˆ๋Š” ๊ฒƒ์„ ๋ฐœ๊ฒฌํ–ˆ์Šต๋‹ˆ๋‹ค. ๋‹จ์ˆœ ์ผ์ • ์กฐํšŒ๋งˆ๋‹ค API๊ฐ€ ํ˜ธ์ถœ๋˜๋ฉด์„œ ๋ถˆํ•„์š”ํ•œ ์š”์ฒญ์ด ๊ธ‰์ฆํ•˜๊ณ  ์žˆ์—ˆ๊ณ , ์ƒ๊ฐ๋ณด๋‹ค ๋งŽ์€ ๋น„์šฉ์ด ๋ฐœ์ƒํ•˜๊ณ  ์žˆ๋Š”๊ฒƒ์„ ํ™•์ธ ํ•  ์ˆ˜ ์žˆ์—ˆ์Šต๋‹ˆ๋‹ค.

์ด ๋ฌธ์ œ๋ฅผ ํ•ด๊ฒฐํ•˜๊ธฐ ์œ„ํ•ด, ์–ด๋–ป๊ฒŒ ํ•˜๋ฉด ๋” ๋น ๋ฅด๊ณ  ์•ˆ์ „ํ•œ ๋ฐฉ๋ฒ•์œผ๋กœ ๋น„์šฉ์„ ์ ˆ๊ฐํ•˜๋ฉด์„œ๋„ ์‚ฌ์šฉ์ž ๊ฒฝํ—˜(User Experience)์„ ์ €ํ•˜์‹œํ‚ค์ง€ ์•Š์„๊นŒ ๊ณ ๋ฏผํ•˜๊ฒŒ ๋˜์—ˆ์Šต๋‹ˆ๋‹ค.

์ด์— ๋Œ€ํ•œ ๋น„์šฉ ์ ˆ๊ฐ ๋ฐฉ์•ˆ์„ ๊ณ ๋ฏผํ•˜์˜€๊ณ , ๊ฐ€์žฅ ๋น ๋ฅด๊ณ  ํšจ๊ณผ์ ์œผ๋กœ ์ค„์ผ ์ˆ˜ ์žˆ๋Š” ๋ฐฉ๋ฒ•์„ ์ฐพ์•„ CloudFront๋ฅผ ํ™œ์šฉํ•œ ์บ์‹ฑ ์ „๋žต์„ ์ ์šฉํ•ด ๋ณด์•˜์Šต๋‹ˆ๋‹ค. ๐Ÿš€


๐Ÿš€ ์ ์šฉ ๋ฐฉ์‹

๐Ÿ”น CloudFront ์ ์šฉ ๋ฐฉ์‹


1๏ธโƒฃ CloudFront๋ฅผ ์ค‘๊ฐ„ ์บ์‹œ ๊ณ„์ธต(Proxy)์œผ๋กœ ์„ค์ •

  • maps.googleapis.com์„ Origin์œผ๋กœ ์„ค์ •ํ•˜์—ฌ Google API ์š”์ฒญ์„ Proxyํ•˜๋„๋ก ๊ตฌ์„ฑ
  • ๋™์ผํ•œ ์š”์ฒญ์ด ๋“ค์–ด์˜ค๋ฉด CloudFront๊ฐ€ ๋Œ€์‹  ์‘๋‹ตํ•˜๋„๋ก ์บ์‹œ ์ ์šฉ (Google๋กœ API ๋ฐœ์†ก X)

2๏ธโƒฃ CloudFront ์บ์‹œ ์ •์ฑ…(Cache Policy)

  • ์ฟผ๋ฆฌ ํŒŒ๋ผ๋ฏธํ„ฐ ๊ธฐ์ค€ ์บ์‹ฑ: center, zoom, size, markers ๊ฐ’ ๊ธฐ์ค€์œผ๋กœ ์บ์‹œ
  • TTL ์„ค์ • (์บ์‹œ ์œ ์ง€ ์‹œ๊ฐ„ ์กฐ์ •)
    • Minimum TTL: 3600์ดˆ (1์‹œ๊ฐ„) - ์ด๊ฑด ๋Š˜๋ฆด ์˜ˆ์ •!
    • Default TTL: 86400์ดˆ (1์ผ)
    • Maximum TTL: 604800์ดˆ (7์ผ)

๐Ÿ”น ๋‹ค๋ฅธ ๋ฐฉ์‹๋„ ๊ณ ๋ คํ•ด๋ดค๋‹ค! (F.Y.I)

S3๋ฅผ ํ™œ์šฉํ•œ CloudFront ์บ์‹ฑ ๋ฐฉ์‹๋„ ๊ณ ๋ คํ–ˆ์Šต๋‹ˆ๋‹ค. ์ด ๋ฐฉ์‹์€ Google Static Maps API์—์„œ ๊ฐ€์ ธ์˜จ ์ด๋ฏธ์ง€๋ฅผ S3์— ์ €์žฅํ•œ ํ›„, ์ดํ›„ ๋™์ผํ•œ ์š”์ฒญ์ด ๋“ค์–ด์˜ค๋ฉด S3์—์„œ ๋ฐ์ดํ„ฐ๋ฅผ ๊ฐ€์ ธ์™€ CloudFront๋ฅผ ํ†ตํ•ด ์ œ๊ณตํ•˜๋Š” ๋ฐฉ์‹์ž…๋‹ˆ๋‹ค.

๐Ÿ“Œ ํ•˜์ง€๋งŒ ๋ช‡ ๊ฐ€์ง€ ๋ฌธ์ œ๊ฐ€ ์žˆ์—ˆ์Šต๋‹ˆ๋‹ค.

  • ์„œ๋ฒ„ ์ฝ”๋“œ ์ˆ˜์ • ํ•„์š” โ†’ ๊ธฐ์กด API ํ˜ธ์ถœ ๋ฐฉ์‹ ๋ณ€๊ฒฝํ•ด์•ผ ํ•จ
  • ๊ธฐ์กด ๋ฐ์ดํ„ฐ ๋ณ€ํ™˜ ๊ณผ์ • ๋ณต์žก โ†’ ์บ์‹œ๋œ ๋ฐ์ดํ„ฐ์˜ TTL์„ ์ ์ ˆํžˆ ์„ค์ •ํ•˜๊ณ  ๊ด€๋ฆฌํ•ด์•ผ ํ•จ
  • ์šด์˜ ๋ถ€๋‹ด ์ฆ๊ฐ€ โ†’ ์ €์žฅ๋œ ์ด๋ฏธ์ง€ ๊ด€๋ฆฌ ๋ฐ TTL ์„ค์ •์ด ํ•„์š”
  • Cloud Front๋ฅผ ํ• ์ธ์„ ๋ฐ›๊ณ  ์žˆ์Œ

๐Ÿ‘‰ ๊ทธ๋ž˜์„œ ๋น ๋ฅด๊ฒŒ ์ ์šฉ ๊ฐ€๋Šฅํ•˜๊ณ  ์œ ์ง€ ๊ด€๋ฆฌ๊ฐ€ ์‰ฌ์šด CloudFront ๋ฐฉ์‹์„ ์ตœ์ข…์ ์œผ๋กœ ์„ ํƒ!


๐Ÿ”ฅ CloudFront URL๋กœ ์ž๋™ ์น˜ํ™˜!

๋น ๋ฅด๊ฒŒ ์ ์šฉ์ด ํ•„์š”ํ•˜๋‹ค๊ณ  ํŒ๋‹จํ•˜์—ฌ ์šฐ์„  Front-end์—์„œ Google ์ฃผ์†Œ๋ฅผ CloudFront ์ฃผ์†Œ๋กœ ์น˜ํ™˜ํ•˜์—ฌ ์ฆ‰์‹œ ๋ฐฐํฌ๋ฅผ ์ง„ํ–‰ํ•˜์˜€๊ณ , ์ดํ›„ Back-end์—์„œ๋„ ํ•ด๋‹น ์ฃผ์†Œ๋ฅผ Config์—์„œ ๊ด€๋ฆฌํ•  ์ˆ˜ ์žˆ๋„๋ก ์ˆ˜์ •ํ•˜์˜€์Šต๋‹ˆ๋‹ค.ย 

Google Map CloudFront๋Š” ํ•˜๋‚˜๋งŒ ์šด์˜ํ•˜๋ฉฐ,
๋ฆฌ์ „๋ณ„๋กœ CF๋ฅผ ์ƒ์„ฑํ•  ๊ฒฝ์šฐ ๋ถˆํ•„์š”ํ•œ Google API ์š”์ฒญ ์ฆ๊ฐ€ ๊ฐ€๋Šฅ์„ฑ์ด ์žˆ์–ด ๋‹จ์ผ ์šด์˜์„ ์œ ์ง€ํ•˜๊ธฐ๋กœ ํ•˜์˜€์Šต๋‹ˆ๋‹ค.


๐Ÿ“Š ๊ธฐ๋Œ€ ํšจ๊ณผ

โœ… ๋น„์šฉ ์ ˆ๊ฐ ํšจ๊ณผ โ†’ Google API ํ˜ธ์ถœ ๊ฐ์†Œ๋กœ ๋น„์šฉ 80% ์ ˆ๊ฐ ๊ธฐ๋Œ€

โœ… ์„œ๋น„์Šค ์‘๋‹ต ์†๋„ ํ–ฅ์ƒ(?!) โ†’ ์บ์‹œ๋œ ๋ฐ์ดํ„ฐ ์ œ๊ณต์œผ๋กœ ์ธํ•ด ์ง€์—ฐ ์‹œ๊ฐ„ ๋‹จ์ถ• ๊ฐ€๋Šฅ์„ฑ

  • ๋ฌผ๋ก  Google ์ž์ฒด ์‘๋‹ต ์†๋„๋„ ๋น ๋ฅด์ง€๋งŒ, CloudFront๋ฅผ ํ™œ์šฉํ•˜๋ฉด ๋” ๋น ๋ฅธ ์‘๋‹ต์„ ๊ธฐ๋Œ€ํ•ด๋ณผ ์ˆ˜ ์žˆ์Œ!

์ด๋ฒˆ ๋น„์šฉ ์ ˆ๊ฐ ํ”„๋กœ์ ํŠธ๋Š” Google Static Maps API์— ํ•œ์ •๋œ ๊ฐœ์„  ์‚ฌํ•ญ์ด์ง€๋งŒ, ๋” ๋‚˜์•„๊ฐ€ Google Place API์™€ ๊ฐ™์€ ๋‹ค๋ฅธ API ์ตœ์ ํ™”๋„ ๊ณ ๋ฏผํ•ด๋ณผ ์˜ˆ์ •์ž…๋‹ˆ๋‹ค! ๐Ÿš€

0๊ฐœ์˜ ๋Œ“๊ธ€