[Node.js - Form 전송]

Wale·2024년 2월 6일

Node.js

목록 보기
4/6

미들웨어 : body-parser

⊙ 데이터를 쉽게 처리할 수 있도록 도와주는 미들웨어
⊙ 요청의 body를 해석해서 req.body로 받을 수 있게 도와 줌
⊙ express 4.x 부터 body-parser가 내장되어 있어 설치 필요 없음

Form

☞ 클라이언트가 서버에게 정보를 전달할 때 사용
⊙ 속성 : action, name, target, method
⊙ 폼 요소 : input, select, textarea, button 등등

Form 속성

⊙ action → 폼을 전송할 서버 주소 지정

⊙ name → 폼을 식별하기 위한 이름

⊙ method → 폼을 서버에 전송할 http 메소드 지정(GET/POST 방식)

  • GET 방식
    ☞ 정보를 가져오거나 검색할 때 쓰임
    ☞ Get 요청시 backend로 보내야하는 데이터가 있다면, URL 쿼리 문자열에 데이터를 실어서 전송
    ☞ 서버(backend)의 값이나 상태를 변경하지 않을 때

  • POST 방식
    ☞ 무언가를 생성하거나 어떤 정보를 보낼 때 쓰임
    ☞ 보내야하는 데이터는 요청(request)의 본문(body)에 실어서 전송
    ☞ 길이가 제한된 URL보다 많은 데이터를 body에 실어서 전송 가능


Form 데이터 전송

◈ GET 방식

☞ 프론트(요청 데이터 전송) → 백엔드

⊙ Input 태그 name 속성이 백엔드 key 값으로 전달된다.

☞ 백엔드(요청 데이터 처리) → 프론트

⊙ 프론트 페이지 요청 데이터는 req.query 객체 형태로 받고 사용할 수 있다.

⊙ 요청 데이터에 대한 응답 페이지를 띄어주기 위해 res.render() 함수를 사용할 수 있다.



◈ POST 방식

☞ 프론트(요청 데이터 전송) → 백엔드

☞ 백엔드(요청 데이터 처리) → 프론트

⊙ 프론트 페이지 요청 데이터는 req.body 객체 형태로 받고 사용할 수 있다.



0개의 댓글