프론트엔드/Node.js

[Express JS] 클라이언트가 서버로 파라미터를 전송하는 방법

bread-gee 2024. 11. 6. 10:48

📌 GET method

🧿 경로 매개변수 (Route Parameters)

  • URL 경로의 일부로 포함되어 전송되는 파라미터
  • 특정 리소스를 식별할 때 사용
// 요청
GET /user/123

// 서버측 라우터
app.get('/user/:id', (req, res) => {
  const userId = req.params.id;
  res.send(`User ID: ${userId}`);
});


===> :id는 경로 매개변수로, req.params.id로 접근할 수 있다.

 

 

🧿 쿼리 문자열 (Query Parameters)

  • URL의 끝에 ? 뒤에 key=value 형태로 전송되는 파라미터
  • 검색 조건, 필터링 옵션 등을 전달할 때 사용
// 요청

GET /search?q=express&page=2

// 서버측 라우터
app.get('/search', (req, res) => {
  const query = req.query.q;
  const page = req.query.page;
  res.send(`Query: ${query}, Page: ${page}`);
});


===> req.query.q와 req.query.page로 각각 q와 page의 값을 가져올 수 있다.

 

 

📌 POST, PUT method

🧿 본문 데이터 (Request Body)

  • 요청의 본문(body)에 포함되는 파라미터
  • JSON, 폼 데이터 등의 형태로 전송
  • Express에서는 express.json() 또는 express.urlencoded() 미들웨어가 필요
// 요청
POST /user
Content-Type: application/json
{
  "name": "Alice",
  "age": 25
}

// 서버측 라우터
app.use(express.json()); // JSON 파싱 미들웨어

app.post('/user', (req, res) => {
  const name = req.body.name;
  const age = req.body.age;
  res.send(`Name: ${name}, Age: ${age}`);
});

===> req.body.name과 req.body.age로 각각 name과 age의 값을 가져온다.

 

 


📌 Common

🧿 헤더 (Headers)

  • HTTP 요청의 메타데이터로, 인증 토큰이나 사용자 에이전트 정보 등 요청과 관련된 추가 정보를 전달할 때 사용
// 요청
GET /profile
Authorization: Bearer abc123

// 서버측 라우터
app.get('/profile', (req, res) => {
  const authToken = req.headers['authorization'];
  res.send(`Authorization Token: ${authToken}`);
});


===> req.headers['authorization']로 헤더 값을 가져올 수 있다.

 


🧿 쿠키 (Cookies)

  • 클라이언트가 서버로 전송할 수 있는 작은 데이터 조각
  • 세션 ID나 사용자 인증 정보를 저장할 때 사용
  • Express에서는 cookie-parser 미들웨어를 사용하여 쿠키를 쉽게 관리할 수 있다.
// 요청
GET /dashboard
Cookie: session_id=xyz789

// 서버측 라우터
const cookieParser = require('cookie-parser');
app.use(cookieParser());

app.get('/dashboard', (req, res) => {
  const sessionId = req.cookies['session_id'];
  res.send(`Session ID: ${sessionId}`);
});


===> req.cookies['session_id']로 쿠키 값을 가져올 수 있다.

 

 

 

👉🏻 요약

방법 요청 접근 코드 주로 사용하는 상황
경로 매개변수
(Route Parameters)
GET /user/123 req.params.key 특정 리소스를 식별할 때
쿼리 문자열
(Query Parameters)
GET /search?q=express&page=2 req.query.key 검색이나 필터 조건 전달 시
본문 데이터
(Request Body)
POST /user
Content-Type: application/json

{ "name": "Alice", "age": 25 }
req.body.key 주로 JSON, 폼 데이터를 전송할 때
헤더 (Headers) GET /profile
Authorization: Bearer abc123
req.headers.key 인증 정보 또는 메타데이터
쿠키 (Cookies) GET /dashboard
Cookie: session_id=xyz789
req.cookies.key 인증 정보 또는 메타데이터