Form 태그
- 웹양식을 만드는 데 사용하는 태그
<form name="입력 폼 이름" action="웹 프로그램 페이지" method="전달 방식">
<input type="폼 모양과 기능" name="입력 폼 변수" value="전달 값"/>
</form>• action : 사용자가 입력한 데이터를 받아 처리하기 위한 웹 프로그램(ASP, PHP,
JSP… 등)의 페이지 지정
• method : 웹 서버와 클라이언트 간의 통신 방법 지정(GET 방식, POST 방식)
• type : 폼의 모양과 기능 결정
• name : 폼의 이름 결정
- 서버, 클라이언트
폼을 이해하기 위해서는 우선 서버와 클라이언트라는 개념을 이해해야 한다. 서버는 정보를 제공하는 쪽이고, 클라이언트는 정보를 제공 받는 쪽을 의미한다.
웹브라우저의 주소창에 생활코딩의 홈페이지인 http://opentutorials.org를 입력하면 웹브라우저는 opentutorials.org에 해당하는 컴퓨터에게 생활코딩 컨텐츠를 요청한다.
이 맥락에서 웹브라우저는 정보를 요청하는 쪽 다시 말해서 제공 받는 쪽이기 때문에 클라이언트가 되고, opentutorials.org의 컨텐츠를 제공하는 컴퓨터는 정보를 제공하기 때문에 서버가 된다.
아래 그림은 서버와 클라이언트의 관계를 나타낸 것이다.
- Form 이란?
폼이란 사용자의 데이터를 서버에 전송하는 방법이다. 일반적으로 아래와 같은 작업을 하기 위해서는 폼을 이용한다.
- 로그인을 위해서 아이디/비밀번호를 입력할 때
- 회원가입을 하기 위해서 개인정보를 입력할 때
- 블로그나 게시판에 글을 작성하거나, 파일을 전송할 때
- GET
- URL 뒤에 파라미터를 붙여서 데이터를 전달하는 방식
- 사용자가 보내는 데이터는 이름과 값이 결합된 문자열 형태로 전달, 각 이름과
값의 쌍은 ‘&’ 기호로 구분 - 서버로 보낼 수 있는 최대 글자수는 2,048자
- URL을 보면 어떤 데이터를 전송하고자 하는지 알 수 있기 때문에 보안에 취약
- POST
- HTTP Request 헤더에 파라미터를 붙여서 데이터를 전송하는 방식
- 서버로 보낼 수 있는 글자수 제한 없음
- GET 방식과 비교하여 보안상 우위에 있음
우리가 기억해야 될 것은 get방식은 사용자정보가 주소창에 고스란히 나타나 보안상 매우 취약하고 글자수도 정해져있어 많은 양의 데이터를 보내지 못한다는 것이다. 그에 반해 post는 쿼리스트링이 바뀌지 않고 글자수도 제한이 없어 많은양의 정보를 전송할 때 사용 한다. 이어서 Apache Tomcat을 활용하여 간단하게 정보를 전송하는 것을 예시로 보자!!
이 실습을 하기전에 Apache Tomcat의 설정을 보고 오도록 하자!!
https://velog.io/@quddnr005/Apache-tomcat-%EC%9B%B9%EC%84%9C%EB%B2%84-%EB%A7%8C%EB%93%A4%EA%B8%B0
Apache Tomcat의 설정이 끝난 후
c드라이브 - Program Files - ApacheTomcat - Tomcatx.x - webapps webapps 폴더에 get폴더를 만들어 준다.
index.html 파일과 index.jsp 파일을 만들어 준 후
코드를 작성하겠다
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<form action="./index.jsp" method="get">
<p>너의 이름은 : <input type="text" name="name"></p>
<button type="submit">전송</button>
</form>
</body>
</html>코드를 설명하면 form안에 action의 경로는 우리가 백으로 data를 받을 경로를 적어주는 것이다. method는 get과 pst 둘중 하나만 사용 할 수 있고, 어떤씩으로 개발하는 것에 따라 get인지 post인지 적으면 되겠다.
우리는 get으로 해볼 것이기 때문에 get으로 적은 것이다.
index.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<%String Strname = request.getParameter("name");%>
당신의 이름은 <br>
<%=Strname%>
</body>
</html>html 위에 작성한 코드는 jsp 에서 한글을 인식하게 하기 위해 적은 인코딩 방식이다.
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%><%%> 이것은 jsp 문법이기 때문에 추 후 jsp를 배우게 되면 자세히 설명하겠다.String Strname = request.getParameter("name")이것은 자바의 문법인데, String 타입의 Strname이라는 변수를 선언한 것이다. Strname에 request.getParameter() 의 jsp 메소드를 넣어주면,
index.html에서 form을 전송하게 되면 쿼리스트링이라는 것을 보내주는데 쿼리스트링은 주소창에 ?로 시작하여 name="" 이런씩으로 나타나는게 쿼리스트링 이다.이어서 form을 전송하면, ?name="내용"을 백으로 넘어가면서
Strname이라는 곳에 값이 담기게 된다.
<%=Strname%>jsp문법으로 <%=Strname%> =Strname 을 출력하겠다는 뜻이다.
