๐Ÿ“š http2 ๋ชจ๋“ˆ๊ณผ axios ๋น„๊ต ๋ถ„์„

SEUNGJUNยท2024๋…„ 12์›” 23์ผ

์•ˆ๋…•ํ•˜์„ธ์š”, ์—ฌ๋Ÿฌ๋ถ„! ์˜ค๋Š˜์€ Node.js์—์„œ ๋งŽ์ด ์“ฐ์ด๋Š” HTTP ํ†ต์‹  ๋„๊ตฌ์ธ http2์™€ axios๋ฅผ ๋น„๊ตํ•ด๋ณด๋ ค๊ณ  ํ•ด์š”.
์–ด๋–ค ์ƒํ™ฉ์—์„œ ์–ด๋–ค ๊ฑธ ์จ์•ผ ํ• ์ง€ ํ—ท๊ฐˆ๋ฆด ๋•Œ๊ฐ€ ๋งŽ์ž–์•„์š”? ๐Ÿค”
์ด ๊ธ€์—์„œ๋Š” ๋‘ ๊ฐ€์ง€ ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ์˜ ํŠน์ง•, ์†๋„, ์•ˆ์ •์„ฑ ๋“ฑ์„ ์‰ฝ๊ณ  ์นœ๊ทผํ•˜๊ฒŒ ๋น„๊ตํ•ด๋ณผ๊ฒŒ์š”! ๐Ÿ› ๏ธโœจ

๐Ÿ“š 1. http2์™€ axios๋Š” ๋ญ์•ผ?

๐Ÿ“Œ http2: Node.js ๋‚ด์žฅ ๋ชจ๋“ˆ

  • Node.js์— ๊ธฐ๋ณธ์œผ๋กœ ํฌํ•จ๋œ HTTP/2 ํ”„๋กœํ† ์ฝœ์„ ์‚ฌ์šฉํ•˜๋Š” ๋ชจ๋“ˆ์ด์—์š”.
  • ๋‹ค์ค‘ ์ŠคํŠธ๋ฆผ(ํ•œ ๋ฒˆ์— ์—ฌ๋Ÿฌ ์š”์ฒญ ์ฒ˜๋ฆฌ)๊ณผ ํ—ค๋” ์••์ถ•, ์„œ๋ฒ„ ํ‘ธ์‹œ ๊ธฐ๋Šฅ์„ ์ œ๊ณตํ•ด์š”. ๐Ÿš€

๐Ÿ‘‰ ์ถ”์ฒœ ์‚ฌ์šฉ ์‚ฌ๋ก€

  • ํ•œ ๋ฒˆ์— ์—ฌ๋Ÿฌ ์š”์ฒญ์„ ๋ณด๋‚ด์•ผ ํ•  ๋•Œ
  • ๊ณ ์„ฑ๋Šฅ API ์„œ๋ฒ„ ๊ตฌ์ถ•

๐Ÿ“Œ axios: ์ธ๊ธฐ ๋งŽ์€ HTTP ํด๋ผ์ด์–ธํŠธ

  • JavaScript/TypeScript ๊ฐœ๋ฐœ์ž๋ผ๋ฉด axios๋ฅผ ํ•œ ๋ฒˆ์ฏค ์จ๋ดค์„ ๊ฑฐ์˜ˆ์š”.
  • ์ง๊ด€์ ์ธ API ๋•๋ถ„์— ์‚ฌ์šฉํ•˜๊ธฐ ์ •๋ง ์‰ฝ๊ณ  ํŽธ๋ฆฌํ•ด์š”. ๐Ÿฅณ
  • ๋ธŒ๋ผ์šฐ์ €์™€ Node.js ๋ชจ๋‘์—์„œ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ์–ด์š”.

๐Ÿ‘‰ ์ถ”์ฒœ ์‚ฌ์šฉ ์‚ฌ๋ก€

  • ๊ฐ„๋‹จํ•œ API ํ˜ธ์ถœ
  • ๋ธŒ๋ผ์šฐ์ €์™€ ์„œ๋ฒ„์—์„œ ๊ฐ™์€ ์ฝ”๋“œ ์‚ฌ์šฉ

๐Ÿ“Š 2. HTTP/2 vs Axios ๋น„๊ตํ‘œ

๐Ÿ› ๏ธ ๋น„๊ต ํ•ญ๋ชฉ๐Ÿš€ HTTP/2 (http2 ๋ชจ๋“ˆ)๐ŸŒ Axios
ํ”„๋กœํ† ์ฝœ ์ง€์›HTTP/2, TLS ์•”ํ˜ธํ™” ์ง€์›HTTP/1.1, HTTP/2 (๊ฐ„์ ‘ ์ง€์›)
ํ†ต์‹  ์†๋„๋ฉ€ํ‹ฐํ”Œ๋ ‰์‹ฑ์œผ๋กœ ๋น ๋ฅธ ์š”์ฒญ ์ฒ˜๋ฆฌ โšก์š”์ฒญ๋ณ„ ๊ฐœ๋ณ„ ์—ฐ๊ฒฐ๋กœ ์ผ๋ฐ˜์ ์ธ ์†๋„ ๐Ÿ“ก
์‚ฌ์šฉ์„ฑAPI๊ฐ€ ๋ณต์žกํ•˜๊ณ  ์ €์ˆ˜์ค€ ์„ค์ • ํ•„์š” ๐Ÿ› ๏ธ์‚ฌ์šฉ์ด ์ง๊ด€์ ์ด๊ณ  ๊ฐ„ํŽธ ๐Ÿงฉ
์š”์ฒญ ๋ฐฉ์‹HTTP/2 ์ŠคํŠธ๋ฆผ ์‚ฌ์šฉPromise ๊ธฐ๋ฐ˜ ์š”์ฒญ/์‘๋‹ต ๐Ÿ“ฅ๐Ÿ“ค
์˜ค๋ฒ„ํ—ค๋“œ๋‚ฎ์€ ํ—ค๋” ์˜ค๋ฒ„ํ—ค๋“œ ๐Ÿ“ฆ๋น„๊ต์  ๋†’์€ ์˜ค๋ฒ„ํ—ค๋“œ ๐Ÿ“Š
์ ์šฉ ์‚ฌ๋ก€๊ณ ์„ฑ๋Šฅ ์„œ๋ฒ„ ๋ฐ ๋Œ€๊ทœ๋ชจ ๋ฐ์ดํ„ฐ ์ „์†ก ๐Ÿ“ˆ์ผ๋ฐ˜์ ์ธ API ํด๋ผ์ด์–ธํŠธ ํ†ต์‹  ๐Ÿ–ฅ๏ธ

โšก๏ธ 3. ์„ฑ๋Šฅ๊ณผ ์•ˆ์ •์„ฑ

๐Ÿš€ http2

  • ์„ฑ๋Šฅ: ๋‹ค์ค‘ ์ŠคํŠธ๋ฆผ, ํ—ค๋” ์••์ถ• ๋•๋ถ„์— ํ›จ์”ฌ ๋น ๋ฅด๊ฒŒ ๋™์ž‘ํ•ด์š”. โšก๏ธ
  • ์•ˆ์ •์„ฑ: ๋‹จ์ผ ์—ฐ๊ฒฐ๋กœ ์—ฌ๋Ÿฌ ์š”์ฒญ์„ ์ฒ˜๋ฆฌํ•˜๊ธฐ ๋•Œ๋ฌธ์— ์•ˆ์ •์ ์ž…๋‹ˆ๋‹ค.

๐Ÿงฉ axios

  • ์„ฑ๋Šฅ: HTTP/1.1 ๊ธฐ๋ฐ˜์ด๋ผ http2๋ณด๋‹ค๋Š” ๋А๋ ค์š”. ๐Ÿข
  • ์•ˆ์ •์„ฑ: ๋ณดํŽธ์ ์œผ๋กœ ์‚ฌ์šฉํ•˜๋Š” ๋„๊ตฌ๋ผ ์•ˆ์ •์„ฑ์€ ๊ฒ€์ฆ๋์–ด์š”. ๐Ÿ‘

๐Ÿค– 4. ์–ธ์ œ http2๋ฅผ ์“ฐ๊ณ , ์–ธ์ œ axios๋ฅผ ์จ์•ผ ํ• ๊นŒ?

์ƒํ™ฉ์ถ”์ฒœ ๋„๊ตฌ
์„ฑ๋Šฅ์ด ๊ฐ€์žฅ ์ค‘์š”ํ•  ๋•Œhttp2 ๐Ÿš€
ํ•œ ๋ฒˆ์— ์—ฌ๋Ÿฌ ์š”์ฒญ์„ ์ฒ˜๋ฆฌํ•ด์•ผ ํ•  ๋•Œhttp2 ๐Ÿ”„
๊ฐ„๋‹จํ•œ API ํ˜ธ์ถœ์ด ํ•„์š”ํ•  ๋•Œaxios ๐Ÿ’ป
์„œ๋ฒ„ & ๋ธŒ๋ผ์šฐ์ € ๋ชจ๋‘ ์ง€์›ํ•ด์•ผ ํ•  ๋•Œaxios ๐ŸŒ
profile
RECORD DEVELOPER

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