CORS

gusdnr814ยท2021๋…„ 6์›” 19์ผ
0

Web

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

๐Ÿ“š Reference


MDN, https://developer.mozilla.org/ko/docs/Web/HTTP/CORS
MDN, https://developer.mozilla.org/ko/docs/Web/Security/Same-origin_policy
Evans Library, https://evan-moon.github.io/2020/05/21/about-cors/
๋ฒจ๋กœํผํŠธ์™€ ํ•จ๊ป˜ํ•˜๋Š” ๋ชจ๋˜ ๋ฆฌ์•กํŠธ, https://react.vlpt.us/redux-middleware/09-cors-and-proxy.html

์ฐธ๊ณ  ์‚ฌ์ดํŠธ์— ๋‚ด์šฉ์„ ๊ฐœ์ธ์ ์œผ๋กœ ๋ณต์Šตํ•˜๊ธฐ ํŽธํ•˜๋„๋ก ์žฌ๊ตฌ์„ฑํ•œ ๊ธ€์ž…๋‹ˆ๋‹ค.
์ž์„ธํ•œ ์„ค๋ช…์€ ์ฐธ๊ณ  ์‚ฌ์ดํŠธ๋ฅผ ์‚ดํŽด๋ณด์‹œ๊ธฐ ๋ฐ”๋ž๋‹ˆ๋‹ค.


SOP


CORS๋ฅผ ์•Œ์•„๋ณด๊ธฐ ์ „์— SOP ๊ฐœ๋…๋ถ€ํ„ฐ ์‚ดํŽด๋ณด๊ฒ ์Šต๋‹ˆ๋‹ค. SOP๋Š” same-origin policy์˜ ์•ฝ์ž๋กœ ๋™์ผ ์ถœ์ฒ˜ ์ •์ฑ…์„ ๋œปํ•ฉ๋‹ˆ๋‹ค. ์„œ๋ฒ„ ์ž…์žฅ์—์„œ ๊ฐ™์€ ์ถœ์ฒ˜์— ๋Œ€ํ•œ HTTP ์š”์ฒญ๋งŒ์„ ํ—ˆ๋ฝํ•˜๋Š” ์ •์ฑ…์œผ๋กœ, ์›น ์–ดํ”Œ๋ฆฌ์ผ€์ด์…˜์—์„œ ์ค‘์š”ํ•œ ๋ณด์•ˆ ๋ชจ๋ธ์ž…๋‹ˆ๋‹ค.

๋™์ผ ์ถœ์ฒ˜๋ผ๋Š” ๋ง์€ ํด๋ผ์ด์–ธํŠธ์™€ ์„œ๋ฒ„์˜ URL์˜ ํ”„๋กœํ† ์ฝœ, ํ˜ธ์ŠคํŠธ, ํฌํŠธ๊ฐ€ ๋ชจ๋‘ ๋™์ผํ•ด์•ผํ•จ์„ ์˜๋ฏธํ•ฉ๋‹ˆ๋‹ค.

๋ณดํ†ต ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ์— ์˜ํ•œ ๋ฐ์ดํ„ฐ ์ ‘๊ทผ์„ ์ œํ•œํ•˜๋ฉฐ, HTML ํƒœ๊ทธ๋ฅผ ํ†ตํ•œ ์ด๋ฏธ์ง€, CSS, Script ์š”์ฒญ์€ ์ œํ•œ๋˜์ง€ ์•Š์Šต๋‹ˆ๋‹ค.ํ•˜์ง€๋งŒ ์›น ์–ดํ”Œ๋ฆฌ์ผ€์ด์…˜์„ ๊ฐœ๋ฐœํ•˜๋‹ค๋ณด๋ฉด ์™ธ๋ถ€ ๋ฆฌ์†Œ์Šค๋ฅผ ์š”์ฒญํ•ด์•ผํ•  ์ผ์ด ๋งค์šฐ ๋งŽ๊ธฐ ๋•Œ๋ฌธ์—, ์ด๋ฅผ ํ•ด๊ฒฐํ•˜๊ธฐ ์œ„ํ•ด ๋‚˜์˜จ ์ •์ฑ…์ด CORS์ž…๋‹ˆ๋‹ค.


CORS๋ž€?


Cross-Origin Resource Sharing์˜ ์•ฝ์ž๋กœ ๋ฒˆ์—ญํ•˜๋ฉด ๊ต์ฐจ ์ถœ์ฒ˜ ๋ฆฌ์†Œ์Šค ๊ณต์œ  ์ •์ฑ…์ด๋‹ค. ์ถœ์ฒ˜๊ฐ€ ๋‹ค๋ฅธ ๊ณณ์˜ ์ž์›์— ์ ‘๊ทผํ•  ์ˆ˜ ์žˆ๋„๋ก ๋ธŒ๋ผ์šฐ์ €์—๊ฒŒ ๊ถŒํ•œ์„ ๋ถ€์—ฌํ•˜๋Š” ์ •์ฑ…์ž…๋‹ˆ๋‹ค.

๋„ค์ด๋ฒ„์—์„œ ์นด์นด์˜ค ์„œ๋ฒ„์˜ ์ž์›์„ ๋ฐ›์•„์˜ค๋ ค๋ฉด SOP์— ์˜ํ•ด ์ œํ•œ๋ฉ๋‹ˆ๋‹ค. ์ด๋ ‡๊ฒŒ ๋‹ค๋ฅธ ์ถœ์ฒ˜์˜ ๋ฆฌ์†Œ์Šค๋ฅผ ๋ถˆ๋Ÿฌ์˜ค๋ ค๋ฉด ๊ทธ ์ถœ์ฒ˜์˜ ์„œ๋ฒ„์—์„œ ๋ฆฌ์†Œ์Šค๋ฅผ ์š”์ฒญํ•˜๋Š” ์ถœ์ฒ˜๋ฅผ ํ—ˆ์šฉํ•˜๋Š” CORS ์‘๋‹ต ํ—ค๋”๋ฅผ ๋ฐ˜ํ™˜ํ•˜๋„๋ก ์„ค์ •ํ•ด์•ผํ•ฉ๋‹ˆ๋‹ค.


CORS๊ฐ€ ๋™์ž‘ํ•˜๋Š” 3๊ฐ€์ง€ ์‹œ๋‚˜๋ฆฌ์˜ค


CORS๊ฐ€ ๋™์ž‘ํ•˜๋Š” 3๊ฐ€์ง€ ์‹œ๋‚˜๋ฆฌ์˜ค๋Š” ๋‹ค์Œ๊ณผ ๊ฐ™์Šต๋‹ˆ๋‹ค.

  • ๋‹จ์ˆœ ์š”์ฒญ

  • ํ”„๋ฆฌํ”Œ๋ผ์ดํŠธ(preflight) ์š”์ฒญ

  • ์ธ์ฆ์ •๋ณด(credentialed)๋ฅผ ํฌํ•จํ•œ ์š”์ฒญ

๋‹จ์ˆœ ์š”์ฒญ

๋‹จ์ˆœ ์š”์ฒญ์€ ํด๋ผ์ด์–ธํŠธ๊ฐ€ ์š”์ฒญ ํ—ค๋”์— Origin(์ถœ์ฒ˜)์— ๋Œ€ํ•œ ์ •๋ณด๋ฅผ ๋‹ด์•„ ์š”์ฒญ์„ ๋ณด๋‚ด๋ฉด, ์„œ๋ฒ„์—์„œ Access-Control-Allow-Origin ํ—ค๋”์— ์ ‘๊ทผ์„ ํ—ˆ์šฉํ•  Origin์— ์ •๋ณด๋ฅผ ๋‹ด์•„ ์‘๋‹ตํ•˜๊ณ , ๋ธŒ๋ผ์šฐ์ €๊ฐ€ ์š”์ฒญํ•œ Origin๊ณผ ํ—ˆ์šฉ๋œ Origin์˜ ๋น„๊ต๋ฅผ ํ†ตํ•ด ์š”์ฒญํ•œ ์‘๋‹ต์„ ์ œ๊ณตํ•˜๋Š” ๋ฐฉ์‹์ž…๋‹ˆ๋‹ค.

ํ”„๋ฆฌํ”Œ๋ผ์ดํŠธ ์š”์ฒญ

ํ”„๋ฆฌํ”Œ๋ผ์ดํŠธ ์š”์ฒญ์€ ์ผ๋ฐ˜์ ์œผ๋กœ ์šฐ๋ฆฌ๊ฐ€ ์›น ์–ดํ”Œ๋ฆฌ์ผ€์ด์…˜์„ ๊ฐœ๋ฐœํ•  ๋•Œ ์ž์ฃผ ๋งˆ์ฃผ์น˜๋Š” ์‹œ๋‚˜๋ฆฌ์˜ค์ž…๋‹ˆ๋‹ค. ์ด ์‹œ๋‚˜๋ฆฌ์˜ค์— ํ•ด๋‹นํ•˜๋Š” ์ƒํ™ฉ์ผ ๋•Œ ๋ธŒ๋ผ์šฐ์ €๋Š” ์š”์ฒญ์„ ํ•œ๋ฒˆ์— ๋ณด๋‚ด์ง€ ์•Š๊ณ  ์˜ˆ๋น„ ์š”์ฒญ๊ณผ ๋ณธ ์š”์ฒญ์œผ๋กœ ๋‚˜๋ˆ„์–ด์„œ ์„œ๋ฒ„๋กœ ์ „์†กํ•ฉ๋‹ˆ๋‹ค.

์ด๋•Œ ๋ณด๋‚ด๋Š” ์˜ˆ๋น„ ์š”์ฒญ์„ ํ”„๋ฆฌํ”Œ๋ผ์ดํŠธ๋ผ๊ณ  ๋ถ€๋ฅด๋ฉฐ, ์ด ์š”์ฒญ์—๋Š” HTTP ๋ฉ”์„œ๋“œ ์ค‘ OPTIONS ๋ฉ”์„œ๋“œ๊ฐ€ ์‚ฌ์šฉ๋ฉ๋‹ˆ๋‹ค. ์˜ˆ๋น„ ์š”์ฒญ์˜ ์—ญํ• ์€ ๋ณธ ์š”์ฒญ์„ ๋ณด๋‚ด๊ธฐ ์ „์— ๋ธŒ๋ผ์šฐ์ € ์Šค์Šค๋กœ ์ด ์š”์ฒญ์„ ๋ณด๋‚ด๋Š” ๊ฒƒ์ด ์•ˆ์ „ํ•œ์ง€ ํ™•์ธํ•˜๋Š” ๊ณผ์ •์ž…๋‹ˆ๋‹ค.

์˜ˆ๋น„ ์š”์ฒญ์— ๋Œ€ํ•œ ์‘๋‹ต์œผ๋กœ ์„œ๋ฒ„๊ฐ€ ์–ด๋–ค ๊ฒƒ๋“ค์„ ํ—ˆ์šฉํ•˜๊ณ , ๊ธˆ์ง€ํ•˜๊ณ  ์žˆ๋Š”์ง€์— ๋Œ€ํ•œ ์ •๋ณด๋ฅผ ๋ณด๋ƒ…๋‹ˆ๋‹ค. ์ดํ›„ ์ž์‹ ์ด ๋ณด๋‚ธ ์˜ˆ๋น„ ์š”์ฒญ๊ณผ ์„œ๋ฒ„๊ฐ€ ์‘๋‹ต์— ๋‹ด์•„์ค€ ํ—ˆ์šฉ ์ •์ฑ…์„ ๋น„๊ตํ•œ ํ›„, ์ด ์š”์ฒญ์„ ๋ณด๋‚ด๋Š” ๊ฒƒ์ด ์•ˆ์ „ํ•˜๋‹ค๊ณ  ํŒ๋‹จ๋˜๋ฉด ๋ณธ ์š”์ฒญ์„ ๋ณด๋ƒ…๋‹ˆ๋‹ค. ์ดํ›„ ์„œ๋ฒ„๊ฐ€ ๋ณธ ์š”์ฒญ์— ๋Œ€ํ•œ ์‘๋‹ต์„ ํ•˜๊ฒŒ ๋˜๋ฉด ๋ธŒ๋ผ์šฐ์ €๋Š” ์ตœ์ข…์ ์œผ๋กœ ์ด ์‘๋‹ต ๋ฐ์ดํ„ฐ๋ฅผ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ์—๊ฒŒ ๋„˜๊ฒจ์ค๋‹ˆ๋‹ค.

์ธ์ฆ์ •๋ณด๋ฅผ ํฌํ•จํ•œ ์š”์ฒญ

์ธ์ฆ์ •๋ณด๋ฅผ ํฌํ•จํ•œ ์š”์ฒญ์€ ์ข€ ๋” ๋ณด์•ˆ์„ ๊ฐ•ํ™”ํ•˜๊ณ  ์‹ถ์„ ๋•Œ ์‚ฌ์šฉํ•˜๋Š” ๋ฐฉ๋ฒ•์ž…๋‹ˆ๋‹ค. ๊ธฐ๋ณธ์ ์œผ๋กœ ๋ธŒ๋ผ์šฐ์ €๊ฐ€ ์ œ๊ณตํ•˜๋Š” ๋น„๋™๊ธฐ ๋ฆฌ์†Œ์Šค ์š”์ฒญ API๋Š” ๋ณ„๋„์˜ ์˜ต์…˜ ์—†์ด ์ฟ ํ‚ค ์ •๋ณด๋‚˜ ์ธ์ฆ๊ณผ ๊ด€๋ จ๋œ ํ—ค๋”๋ฅผ ํ•จ๋ถ€๋กœ ์š”์ฒญ์— ๋‹ด์ง€ ์•Š์Šต๋‹ˆ๋‹ค. ์ด๋•Œ ์š”์ฒญ์— ์ธ์ฆ๊ณผ ๊ด€๋ จ๋œ ์ •๋ณด๋ฅผ ๋‹ด์„ ์ˆ˜ ์žˆ๊ฒŒ ํ•ด์ฃผ๋Š” ์˜ต์…˜์ด credentials ์˜ต์…˜์ž…๋‹ˆ๋‹ค.

์ด ์˜ต์…˜์—๋Š” 3๊ฐ€์ง€ ๊ฐ’์„ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ์œผ๋ฉฐ, ๋‹ค์Œ๊ณผ ๊ฐ™์Šต๋‹ˆ๋‹ค.

  • same-origin(๊ธฐ๋ณธ๊ฐ’) : ๊ฐ™์€ ์ถœ์ฒ˜ ๊ฐ„ ์š”์ฒญ์—๋งŒ ์ธ์ฆ ์ •๋ณด๋ฅผ ๋‹ด์„ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

  • include : ๋ชจ๋“  ์š”์ฒญ์— ์ •๋ณด๋ฅผ ๋‹ด์„ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

  • omit : ๋ชจ๋“  ์š”์ฒญ์— ์ธ์ฆ ์ •๋ณด๋ฅผ ๋‹ด์ง€ ์•Š์Šต๋‹ˆ๋‹ค.

๋งŒ์•ฝ ์šฐ๋ฆฌ๊ฐ€ same-origin์ด๋‚˜ include์™€ ๊ฐ™์€ ์˜ต์…˜์„ ์‚ฌ์šฉํ•˜์—ฌ ๋ฆฌ์†Œ์Šค ์š”์ฒญ์— ์ธ์ฆ ์ •๋ณด๊ฐ€ ํฌํ•จ๋œ๋‹ค๋ฉด, ๋ธŒ๋ผ์šฐ์ €๋Š” ๋‹ค๋ฅธ ์ถœ์ฒ˜์˜ ๋ฆฌ์†Œ์Šค๋ฅผ ์š”์ฒญํ•  ๋•Œ ๋‹จ์ˆœํžˆ Access-Control-Allow-Origin๋งŒ ํ™•์ธํ•˜๋Š” ๊ฒƒ์ด ์•„๋‹ˆ๋ผ ๋‘ ๊ฐ€์ง€ ์กฐ๊ฑด์„ ๋” ๊ฒ€์‚ฌํ•˜๊ฒŒ ๋ฉ๋‹ˆ๋‹ค.

  • Access-Control-Allow-Origin์—๋Š” *๋ฅผ ์‚ฌ์šฉํ•  ์ˆ˜ ์—†์œผ๋ฉฐ, ๋ช…์‹œ์ ์ธ URL์ด์–ด์•ผ ํ•ฉ๋‹ˆ๋‹ค.

  • ์‘๋‹ต ํ—ค๋”์—๋Š” ๋ฐ˜๋“œ์‹œ Access-Control-Allow-Credentials: true๊ฐ€ ์กด์žฌํ•ด์•ผํ•ฉ๋‹ˆ๋‹ค.

profile
Just Do It ๐Ÿ’ช๐Ÿ’ข

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