반응형
Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | ||||
4 | 5 | 6 | 7 | 8 | 9 | 10 |
11 | 12 | 13 | 14 | 15 | 16 | 17 |
18 | 19 | 20 | 21 | 22 | 23 | 24 |
25 | 26 | 27 | 28 | 29 | 30 | 31 |
Tags
- nuxt universal rendering
- d3 지도 툴팁
- 인터넷 거버넌스
- pm2 업데이트 에러
- vue 컴포저블 함수
- d3 지도 타입스크립트
- d3 지도
- d3 지도 확대/축소
- 참조형 props의 default
- 화살표 함수 {}
- reflow
- 참조형 default
- $fetch
- cloud firestore id auto increment
- vue draggable 차트 안나옴
- component is already mounted please use $fetch instead.
- firebase id 자동
- ToDo
- vuedraggable
- repaint
- vue3 drag and drop
- commonjs와 ecmascript modules(esm)
- in-memory pm2 is out-of-date
- git
- 함수형 프로그래밍
- vue composable 함수
- ecmascript modules(esm)
- Learning React
- pm2 버전 충돌
- 화살표 함수 중괄호
Archives
- Today
- Total
빵 입니다.
[Express JS] 클라이언트가 서버로 파라미터를 전송하는 방법 본문
반응형
📌 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 | 인증 정보 또는 메타데이터 |
반응형
'프론트엔드 > Node.js' 카테고리의 다른 글
In-memory PM2 is out-of-date, do: $ pm2 update (0) | 2025.04.10 |
---|---|
npm does not support Node.js (0) | 2022.07.25 |
[mongoose] remove() / deleteOne() / findOneAndDelete() 차이 (0) | 2019.04.26 |
[express] express 4.x PUT, DELETE method 사용하기 (0) | 2019.04.23 |
[handlebars] configuration 에러 (0) | 2019.04.10 |