form data 전송

Tony·2021년 8월 15일
0

HTML

목록 보기
3/14

프론트에서 DB에 값을 저장하려 할 때 POST 방식으로 전송을 하게 된다.
form으로 전송하는 경우,
file이 포함되지 않았다면,
enctype이 application/x-www-form-urlencoded
file이 포함되었다면,
multipart/form-data로 지정 해줘야 한다.

1. form

1-1. name

  • form의 이름, 서버로 보내질 때 이름의 값으로 데이터 전송

1-2. action

  • form이 전송되는 서버 url또는 html 링크

1-3. method

  • 전송 방법 설정, GET or POST 등
<form action="./result.html" name="loginForm" method="get">
    <p>id: <input type="text" name="id" /></p>
    <p>password: <input type="password" name="password" /></p>
    <input type="submit" value="log in" />
</form>

// /result.html?id=asdf&password=1234

get방식이나 post방식이나 보안솔루션을 마련하지 않으면 보안에 취약한 것은 똑같음

1-4. autocomplete

  • 자동 완성
  • on 으로 설정하면 form 전체에 자동 완성 허용

1-5. enctype : 인코딩 유형

  • 브라우저에서 서버에 데이터를 다시 게시 하는데 사용하는 인코딩 유형

1-5-1. application/x-www-form-urlencoded

  • 양식 데이터는 이름/값 쌍으로 인코딩됩니다. 표준 인코딩 형식입니다.(default)

1-5-2. multipart/form-data

  • 양식 데이터는 페이지의 각 컨트롤에 대 한 별도의 파트를 포함 하는 메시지로 인코딩됩니다.

1-5-3. text/plain

  • 양식 데이터는 컨트롤이 나 서식 지정 문자가 없는 일반 텍스트로 인코딩됩니다.

2. input

2-1. type:file

  • multiple 속성을 추가해야 다중 선택이 가능해짐

참고 문헌

나중에 볼 문서들

profile
움직이는 만큼 행복해진다

0개의 댓글