(3)API라우터의 함수 파라미터 중 하나인 Request의 구성 : Params, queryString, cookies, body, method

● 이론0_ 명칭 정리 :

○ js내에서 아래와 같이 함수를 작성할 때, 그 함수가 바로 "라우터"

○ 라우터 정의 : http파일에서, 서버에 GET, POST 등의 리퀘스터 요청이 들어올 때, 반응하는 함수를 의미하는 거 같다.

//api/[id].js
export default function handler(req, res)
{
	res.send('안녕 다이나믹 라우트!');
}

○ 라우터의 매개인자 'Request'의 객체 프로퍼티 목록 

• Params : 보내진 리퀘스트의 id, query 등의 속성 정보들을 담겨있다.

예 : 리퀴스트의 id를 확인해보기

- request.http 

Post

- [id].js

export default function handler(request, response) {
  response.send(request.query);
  //query 프로퍼티로 출력
}

- 출력결과 :

HTTP/1.1 200 OK
ETag: "elmy7e0rzjc"
Content-Type: application/json; charset=utf-8
Content-Length: 12
Vary: Accept-Encoding
Date: Sat, 04 Jan 2025 04:58:05 GMT
Connection: close

{
  "id": "123"//id가 출력된다.
}

 

• queryString : 리퀘스트에서 요구하는 문자열을 의미하는 것 같음

예 : 리퀴스트의 queryString 확인해보기

- request.http 

GET http://localhost:3000/api/short-links/123

- [id].js

export default function handler(request, response) {
  response.send(request.query);
  //query 프로퍼티로 출력
}

- 출력결과 :

HTTP/1.1 200 OK
ETag: "5wa28l0e6x12"
Content-Type: application/json; charset=utf-8
Content-Length: 38
Vary: Accept-Encoding
Date: Sat, 04 Jan 2025 05:03:10 GMT
Connection: close

{
  "offset": "10",//offset
  "limit": "5",//limit
  "id": "123"
}

- 주목해야할 점 :

Params와 queryString의 항목들은 같은 객체에 저장(query객체)되어있다는 것을 주목하래 //이유는 모름

 

• body : 받은 리퀘스트에 대한 제목, 내용 등의 리퀘스트에 대한 정보

예 : 리퀴스트의 body 확인해보기

- request.http 

POST http://localhost:3000/api/short-links/123?offset=10&limit=5
Content-Type : application/json

{
	"title" : "codeit"
}

//post로 리퀘스트 하기

- [id].js

export default function handler(request, response) {
  response.send(request.query);
  //body 프로퍼티로 출력
}

- 출력결과 :

HTTP/1.1 200 OK
ETag: "nevrmfwk4zq"
Content-Length: 26
Date: Sat, 04 Jan 2025 05:09:38 GMT
Connection: close

{
  "title" : "codeit"
}

 

• Cookies : 간단한 브라우저 사용자의 정보, 로그인 후 인증정보의 저장해둔뒤 리퀘스트할 때, 보내는 정보

예 : 리퀴스트의 Cookie 확인해보기

- request.http 

GET http://localhost:3000/api/short-links/123?offset=10&limit=5
Cookie : sesstion-id=sibaloma1234


//GET로 리퀘스트 하기

- [id].js

export default function handler(request, response) {
  response.send(request.cookies);
  //cookies프로퍼티로 출력
}

- 출력결과 :

HTTP/1.1 200 OK
ETag: "29n21w26tnu"
Content-Type: application/json; charset=utf-8
Content-Length: 30
Vary: Accept-Encoding
Date: Sat, 04 Jan 2025 05:15:35 GMT
Connection: close

{
  "sesstion-id": "sibaloma1234"
}

 

• method : 리퀘스트의 GET , POST , DELETE 등의 명령어 메소드 데이터 담긴 프로퍼티

예 : 리퀴스트의 method 확인해보기

- request.http 

POST http://localhost:3000/api/short-links/123?offset=10&limit=5
Content-Type: "application/json"

{
  "title" : "codeit"
}

- [id].js

export default function handler(request, response) {
  response.send(request.method);
  //method 프로퍼티로 출력
}

- 출력결과 :

HTTP/1.1 200 OK
ETag: "o0hog2bp1f4"
Content-Length: 4
Date: Sat, 04 Jan 2025 05:17:31 GMT
Connection: close

POST/대문자로 출력된다.

 

요약 :

- Params :

• 정의 : id와 같은 정보 출력
• request 프로퍼티 : query

- queryString :

• 정의 : offset, limit 과 같은 데이터 요구 정보 query명령어
• request 프로퍼티 : query

- body :

• 정의 : title Content와 같은 리퀘스트 보낸 사람이 적은 세부 내용
• request 프로퍼티 : body

- Cookies :

• 정의 : 로그인 정보 , 인증정보를 저장해두었다가, 리퀘스트할 떄, 보내는 정보
• request 프로퍼티 : cookies

- method :

• 정의 : GET, POST.. 등의 리퀘스트 명령어가 담긴 정보
• request 프로퍼티 : method //대문자로 출력됨