TIL ๐Ÿ‘ฉ๐Ÿปโ€๐Ÿ’ป

์ˆ˜ํˆด๋ฆฌ ์–‘ยท2021๋…„ 7์›” 3์ผ
0

๏ผŠsame origin ๊ธฐ์ค€ : ํ”„๋กœํ† ์ฝœ(http/https), ๋„๋ฉ”์ธ(์ฃผ์†Œ), ํฌํŠธport ์ด ์…‹์ด ๋ชจ๋‘ ๊ฐ™์€ ๊ฒƒ์ด same origin!
๏ผŠpromise์ผ ๋•Œ๋งŒ await๊ฐ€ ์˜๋ฏธ๊ฐ€ ์žˆ์Œ, ํ•„์š”์—†๋‹ค๋ฉด ๊ตณ์ด ์“ธ ์ด์œ ๊ฐ€ ์—†๋‹ค.

โ– Express

express.js๋Š” node.js ํ™˜๊ฒฝ์—์„œ ์›น์„œ๋ฒ„/API ์„œ๋ฒ„ ์ œ์ž‘์„ ์œ„ํ•ด ์‚ฌ์šฉ๋˜๋Š” ํ”„๋ ˆ์ž„์›Œํฌ

  • ์‘๋‹ต์„ json ๋ฐ์ดํ„ฐํƒ€์ž…์œผ๋กœ ์ฃผ๋Š” ๋ฐฉ๋ฒ•: res.end(), res.send(), res.json()

  1. res.json({๊ฐ์ฒด}๋“ค์–ด๊ฐ)

    • res.send()์™€์˜ ์ฐจ์ด: res.json()์€ ๋ฐ›์€ ์ธ์ž๋ฅผ json ๋ฌธ์ž์—ด๋กœ ๋ณ€ํ™˜ํ•ด์„œ ํ—ค๋“œ์— 'Content-Type': 'application/json'์œผ๋กœ ์…‹ํŒ…ํ•ด์ฃผ๊ณ , body์ธ์ž์— ์ €์žฅํ•ด์„œ ๋‚ด๋ถ€์ ์œผ๋กœ res.send๋ฅผ ํ˜ธ์ถœํ•ด์„œ body์ธ์ž๋กœ ๋„˜๊ฒจ์คŒ
  2. res.send()

    • express ๋ฌธ๋ฒ•, JSON.stringify ์จ์•ผํ•จ
    • header ๋ถ™์ด๊ธฐ ์œ„ํ•ด ์‘๋‹ต ๋ฐ”๋”” ๋‚ด์— res.send('Content-Type', 'application/json') ์ž‘์„ฑํ•ด์•ผ ํ• ๊นŒ?
      โ†’ ์ด๋ฏธ res.jsonp([body]) ๊ฐ€ ์žˆ์Œ!
      Sends a JSON response with JSONP support. This method is identical to res.json(), except that it opts-in to JSONP callback support.
      express ๊ณต์‹๋ฌธ์„œ
  • ๋ผ์šฐํ„ฐ app.use('/',routerFile๋ช…)
  • ๋ฏธ๋“ค์›จ์–ด

    http์š”์ฒญ ์ธ์ˆ˜ํ•ด์„œ ๋กœ๋“œ(?) ์ฐ๊ธฐ - cors ํ—ค๋” ์ถ”๊ฐ€ - ๋ฐ”๋””parse -> http ์‘๋‹ต ์ธ์ˆ˜๊นŒ์ง€ - ์ปจ๋ฒ ์ด์–ด ๋ฒจํŠธ์™€ ๊ฐ™์€ process์—์„œ ์ด ์ค‘๊ฐ„ ๊ณผ์ •๋“ค์„ ๋ฏธ๋“ค์›จ์–ด๋กœ ์ฒ˜๋ฆฌ
    • express์˜ ํฐ ์žฅ์ 
    • get, use ๋“ฑ
  • ๋ฏธ๋“ค์›จ์–ด ์‚ฌ์šฉํ•  ๋•Œ:
    • ๋ชจ๋“  ์š”์ฒญ/์‘๋‹ต์— CORSํ—ค๋”๋ฅผ ์ถ”๊ฐ€ํ•  ๋•Œ: app.use(cors())
    • ์š”์ฒญ(POST / ๋“ฑ)์— ํฌํ•จ๋œ body(payload)๋ฅผ ์‰ฝ๊ฒŒ ์–ป๋Š” ๋ฐฉ๋ฒ•, bodyParser ๋ฏธ๋“ค์›จ์–ด ์‚ฌ์šฉ: app.use(express.json())
    • req.method ๋˜๋Š” req.url ํ™•์ธ
    • ์š”์ฒญ header ๋‚ด ์‚ฌ์šฉ์ž์˜ ์ธ์ฆ ์ •๋ณด ํฌํ•จ ์—ฌ๋ถ€ ํ™•์ธ
      ...
  1. next: ์—๋Ÿฌ์ฒ˜๋ฆฌ ๋ฏธ๋“ค์›จ์–ด

  • (.then ๊ณผ ๊ฐ™์€ ๋Š๋‚Œ, ์ฝœ๋ฐฑ์„ ์ธ์ˆ˜?ํ˜ธ์ถœ?ํ•œ๋‹ค๋Š” ์ ์—์„œ.)
  • next()๋ฅผ ํ˜ธ์ถœํ•˜์ง€ ์•Š์œผ๋ฉด ํŒŒ์ดํ”„๋ผ์ธ์ด ๊ทธ ๋ฏธ๋“ค์›จ์–ด์—์„œ ์ข…๋ฃŒ๋˜๊ณ , ์ดํ›„์˜ ๋ผ์šฐํŠธ ํ•ธ๋“ค๋Ÿฌ์™€ ๋ฏธ๋“ค์›จ์–ด๊ฐ€ ํ˜ธ์ถœ๋˜์ง€ ์•Š์Œ
    // ์˜ˆ์‹œ๋ฅผ ๋“ค์ž๋ฉด
    app.use((req, res, next) => {
     console.log('๋‚ด๊ฐ€ ์ถ”๊ฐ€ํ•œ ๊ณต์ •');
     next(); // <- ํ˜ธ์ถœ
    });

โ—๏ธ next๋ฅผ ํ˜ธ์ถœํ•˜์ง€ ์•Š๋Š”๋‹ค๋ฉด ํด๋ผ์ด์–ธํŠธ์—๊ฒŒ ์–ด๋–ค ์‘๋‹ต์ด๋ผ๋„ ๋ณด๋‚ด์•ผ ํ•จ

app.use((req, res, next) => {
 console.log(req.body)
 res.status(404).send('Not Found!'); // <- ์‘๋‹ต ์ฒ˜๋ฆฌ
});
app.use((err, req, res, next) => {
  console.error(err.stack);
  res.status(500).send({ // <- ์‘๋‹ต ์ฒ˜๋ฆฌ
    message: 'Internal Server Error',
    stacktrace: err.toString()
  });
});
  • ์š”์ฒญ/์‘๋‹ต ์ธ์ˆ˜
    ๏ผŠreq === request, res === response
  1. req.params vs req.qeury

    req.params๋Š” ๋ผ์šฐํŒ…({path})์ด user/:name์™€ ๊ฐ™์ด {:id} ํ˜•ํƒœ์ธ ๊ฒฝ์šฐ
    req.query๋Š” /flight?departur=ICN&destination=CJU ์™€ ๊ฐ™์€ ์ฟผ๋ฆฌ์ŠคํŠธ๋ง์ด ๊ฐ์ฒด๋กœ.
profile
developer; not kim but Young

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