[TIL 16일차] api router 와 api response

Routing이란?

클라이언트의 요청 조건(Http 메서드, 주소 등)에 대응해 응답(Response)하는 방식을 말한다.

Express.js의 Routing

Express.js에서는 Routing을 쉽게 하기 위해서 Router기능을 제공한다.

Router의 구조

router.METHOD(PATH, HANDLER);

• router: Express.js의 라우터를 정의하기 위해 사용합니다.
• METHOD: HTTP Method를 나타냅니다. (ex: get, post, put, patch, delete …)
• PATH: 실제 서버에서 API를 사용하기 위한 경로를 나타냅니다. (ex: users, posts …)
• HANDLER: 라우트가 일치할 때 실행되는 함수힙니다.

실제예제로 구현해보기

위의 기능을 구현 예정(바로 전 글과 이어짐)

1) routes 폴더를 만든후 안에 goods.js파일을 만들어줌

2) goods.js에 express.js를 import 및 router해줌

//express.js를 사용하기 위해서 import해준다
import express from 'express';

// 익스프레스의 라우터 생성
const router = express.Router();

3) 예시로 사용할 엔드포인트 작성

// routes/goods.js

// localhost:3000/api/ GET
router.get('/', (req, res) => {
  res.json('default url for goods.js GET Method');
});

// localhost:3000/api/about GET
router.get('/about', (req, res) => {
  res.json('goods.js about PATH');
});

4) 사용한 router를 app.js에서 사용해주기 위해 export해주어야함

// routes/goods.js

export default router;

5) 실제로 사용할 파일인 app.js에 goods.js를 import해주고 사용한다.

// app.js

import goodsRouter from './routes/goods.js';

// localhost:3000/api -> goodsRouter
app.use('/api', [goodsRouter]);

6) 적용이 끝나면 테스트 해보기

터미널 -> node app.js로 app.js를 실행후 웹브라우저에서 localhost:3000/api 와 localhost:3000/api/about을 입력해보면 입력결과가 나오는 것을 확인해 볼 수 있다.

 

*params에대해서

api의 주소부분에서 추가적으로 전달되는 부분을 params(경로 변수)

/** 뉴스 세부 조회 API **/
// 3. HTTP Method와 URL을 지정한 API를 정의합니다.
// 만약, localhost:3000/api/news/:newsId 라는 URL로 GET 요청이 들어온다면 해당 코드를 실행합니다.
router.get('/news/:newsId', (req, res) => {
  // 클라이언트가 전달한 Path Params 데이터를 받아옵니다.
  const params = req.params;

  // Path Params 데이터 중 newsId를 추출합니다.
  const newsId = params.newsId;

  // 서버 콘솔에 클라이언트가 전달한 newsId를 출력합니다.
  console.log('클라이언트로 부터 전달받은 뉴스 ID:', newsId);

  // 4. 사용자의 요청에 맞는 데이터를 json 형태로 반환합니다.
  return res.status(200).json({
    data: '뉴스 세부 조회 API 입니다.',
  });
});

다음과 같은 코드가 있을때

router.get('/news/:newsId', (req, res)

위에서 /news뒤에 /:newsId 부분을 params라고 하며 접속할 때는 

localhost:3000/api/news/id~~ 와 같은 방식으로 접속할 수 있고,

params.newsId 라고하면 뒤에 붙은 params의 정보를 가지고 올 수 있다.