System.out.println("Hello, World");

'프로그래밍/JSP & Servlet'에 해당되는 글 36건

  1. 2012.04.23 초기 파라미터
  2. 2012.04.20 회원가입 form 만들기
  3. 2012.04.20 로그인 form 만들기
  4. 2012.04.20 계산기 만들기
  5. 2012.04.20 HttpServletRequest
  6. 2012.04.20 HTML - Input 태그
  7. 2012.04.19 HTML(입력 관련 태그들) & 구현
  8. 2012.04.19 요청 파라미터
  9. 2012.04.19 HttpServletRequest, Response
  10. 2012.04.19 Service()가 실행될때마다 카운터 쌓기

초기 파라미터

 - 서버단 컴포넌트(Servlet, JSP, Listener등)이 사용하는 문자열중 나중에 변경 될 수 있는 문자열을 web.xml에 등록해 놓고 컴포넌트에서는 호출하여 사용

 - 나중에 변경시 설정에서만 바꾸면 컴포넌트의 수정없이 변경 가능

 - 초기 파라미터 2가지

* 특정 서블릿 JSP만 사용할 수 있는 초기 파라미터

 - ServletConfig 사용

* Application내 모든 Servlet이 사용할 수 있는 초기 파라미터 - ServletContext 이용


 * javax.servlet.ServletConfig

 - Servlet 객체가 일하는데 필요한 정보를 가지고 있는 객체

 - WebContainer가 생성하여 Servlet()의 init() 호출시 중집

 - Servlet 객체당 하나씩 생성


*ServletConfig를 이용한 초기 파라미터 처리

1. Web.xml에 초기 파라미터 설정

<servlet>

<servlet-name>서블릿 객체 이름</servlet-name>

<servlet-class>서블릿 클래스 이름</servlet-class>

<init-param>

<param-name>초기파라미터 이름</param-name>

<param-value>초기 파라미터 값</param-value>

</init-param>

</servlet>

-초기 파라미터가 여러개인 경우 <init-param>을 반복

ex)

2. 코드상에서 조회

ServletConfig 객체.getInitParameter(String paramName) : String paramValue

주석처리한것처럼 해도 되지만 2줄을 써서 할바에야 한줄로 간단히 하는게 더 빠르다.


ex)예제 만들기

1. greeting_form.html을 다음과 같이 만들어주고 서버를 올려서 결과처럼 나오는지 확인한다.


2. 그리고 web.xml에서 초기파라미터를 설정해줘야 하니 다음과 같이 작성한다.


3. web.xml도 설정해줬으니 여기서 파라미터를 받는 GreetingServlet를 설정한다.



4. greeting_form.html에서 이름 텍스트 박스에서 이름을 작성한후 영어 전송을 했을떄 다음과 같이 나오면 성공적으로 한 것이다.


5. 이번에는 web.xml에서 서블릿을 한개 더 만들어서 서블릿을 2개 이용해보겠다. web.xml에 다음과 같이 더 추가한다.


6. 이제 greeting_form.html에서 밑에 있는 한글전송을 눌러봐서 다음과 같이 나오나 확인한다. 




*javax.servlet.ServletContext

-web Application이 자체 또는 일하는데 필요한 정보를 가지고 있는 객체

-web Component는 Web Application과 관련된 정보를 조회하거나 업무를 처리할 때 ServletContext type객체를 이용

-web Applictaion이 시작할 때 Web container에 의해 생성된다.

-Servlet의 getServletContext()를 통해 조회

-ServletContext ctx - getServletContext();

-web Application 당 하나가 생성됨


*ServletContext를 이용한 초기 파라미터 처리

1. web.xml에 초기 파라미터 설정

<web-app>

<context-param>

<param-name>초기파라미터이름</param-name>

<param-value>초기파라미터 값</param-value>

</context-param>


2. 코드상에서 조회

ServletContext객체.getInitParameter(String paramName) : String paramValue


ex)만들어 보기

1. web.xml에 파라미터를 설정한다.



2. ContextParamServlet 작성


3. 서버를 재가동하여 http://127.0.0.1:8088/myweb/ContextParamServlet 이 제대로 나오는지 확인한다.


○ javax.servlet.ServletConfig vs javax.servlet.ServletContext

확인한다ServletConfig는 서블릿당 하나니며, ServletContext는 웹 어플리케이션 당 하나이다. 

웹 어플리케이션은 오직 하나의 ServletContext으로 전체 웹 어플리케이션에서 정보를 공유한다. 그러나 웹 어플리케이션 안에 있는 서블릿은 자신만의 ServletConfig를 가진다. 컨테이너는 웹 어플리케이션이 배포되는 시점에 ServletContext를 생성하며, 서블릿이나 JSP(서블릿의 일종)에서 이용 가능하도록 한다. 


 - 동일 웹 어플리케이션에서 컨테스트 초기화 파라미터 이름과 서블릿 초기화 파라미터 이름이 같아도 상관없는 이유는 ServletContext와 ServletConfig는 서로 다른 객체며, 

   동일한 이름을 사용하더라도, 서로 다른 이름공간을 사용하기에 충돌이 일어나지 않는다.


Posted by 김마농

○ 개요

 - ID, 패스워드, 이름 입력하는 텍스트창을 구현한다. 

 - 성별을 선택할 수 있게 라디오버튼을 구현한다.

 - 생일에서 년도는 텍스트로 입력받고, 월과 일은 select로 구현한다. 

 - 관심있는 항목은 checkbox로 받으면서 여러개 선택가능하니 배열로 받아서 구현한다.

 - 자기소개는 textarea로 구현한다.

 - 가입버튼과 초기화 버튼을 구현한다.


1. LoginServlet를 생성한다.


2. login.html를 구현한다.


3. RegisterServlet은 다음과 같이 코딩한다.

사용자 관심항목에서 여러개를 선택하고 넘겨야 하니까 배열로 받은후 넘겨야 한다.



4. register.html은 다음과 같이 코딩한다.


5. web.xml은 다음과 같이 코딩해준다.

6. 다음과 같이 화면에 출력되어야 정상적으로 된 것이다.


7. 다음과 같이 항목에다가 적당한 값을 입력하고 회원가입을 하면 화면에 출력되어야 한다.


8. 다음과 같이 회원가입할때 입력한 값들이 정상적으로 출력되면

완성한것이다.


Posted by 김마농

○ 개요

 - 로그인창과 패스워드창,가입하기 버튼과 초기화 버튼을 구현한다. 

 - 아직 DB를 연동안하기 떄문에 ID와 PASSWORD를 각각 'java'와 'servlet'로 정한후 이 아이디와 패스워드로만 접속하게 만든다.


1. 우선 LoginServlet을 만들어준다.


2. 그리고 login.html을 만들어준다.


3. LoginServlet을 다음과 같이 코딩해준다.


4. login.html을 다음과 같이 코딩한다.


5. web.xml도 다음과 같이 묶어준다.


6. 다음과 같이 로그인 form이 꾸며지고 아까 말한 java와 servlet으로 접속을 한다.


7. 다음은 아이디와 패스워드에 따라 변하는 화면이다.

-로그인 성공했을때


-로그인시 ID가 다를때


-로그인시 PASSWORD가 다를때





Posted by 김마농

○ 개요

 - 두개의 숫자를 연산하기 위해서 숫자가 들어가는 텍스트창을 2개 구현한다.

 - Radio버튼이나 Select를 이용하여 연산자(+,-, X, /)를 구현한다.

 - 계산버튼을 눌러서 계산이 되게 해야 한다.


1. 우선 Calculator 클래스 파일을 만들어준다.


2. 작업하기 쉽게 WebContent쪽에 form폴더를 만들어준후 calculator.html파일을 생성한다.



3. 우선 Calculator.java를 코딩한다.


4. 그리고 아까 form폴더에 만들어둔 calculator를 코딩한다.


5. 그다음 역시 Web.xml에 가서 연결한다.


6. 결과




Posted by 김마농

String value = getParameter(String name)


String[] values = getParameter(String name)


만약 name을 모를 경우 

Ennameration names = getParameterName()을 쓰면 된다.

Posted by 김마농

 &lt;, &gt;

 - 꺽쇠의 의미. 

&lt -> "<"

&gt -> ">"


○ type = "text"


value는 텍스트창에 기본값으로 넣는 용도로 쓰이며, size는 화면에 길이가 X인 텍스트창을 표시하며 maxlength는 최대 입력 길이 제한을 의미한다.



○ type = "password"

패스워드 입력을 할 수 있는 입력폼이 생성된다. 텍스틑 입력할때에는 안보이게 표시된다.


○ type = "checkbox"

위 그림과 같이 체크박스가 생긴다.


○ type = "checkbox" label 연결하기

하루동안 안보이기를 선택해도 체크박스에 체크가 된다. 


라벨 연결은 다음과 같이 연결해도 되지만 전자처럼하는 방법이 정석이니 참고만 한다.


○ type = "radio"


○ type = "radio" 그룹묶기

type="radio"에서 name을 모두 동일하게 하면 그룹으로 묶여진다. 위와 같은 결과 화면에서 no를 선택한 후 ok를 선택하면 되면 
no에 있던 버튼이 사라지고 ok에 표시된다. 

○ type = "file"

위와 같은 화면에서 찾아보기를 선택하면

위 화면과 같이 파일을 선택하는 화면이 출력된다.


파일을 선택하면 위와 같이 표시된다. 서버로 보낼때에는 경로가 보내지는게 아니라 파일이 전송된다.


○ type = "hidden"

화면에서는 아무것도 표시가 안된다. 


○ type = "button"

type="button"은 단독으로 쓰이지 않고 자바 스크립트랑 같이 연동해서 쓰인다. 뒤에 있는 onclick은 자바스크립트다.

value는 버튼에 쓰여질 문구로 쓰인다.



○ type = "reset"



위와 같이 체크박스와 버튼 등을 선택한 다음 [초기화버튼]을 누르게 되면


위와 같이 선택된것이 모두 초기화 된다. 


○ type = "button"

전송버튼을 누르게 되면 input에 입력된 모든 값들이 넘어가게 된다. 












Posted by 김마농

<HTML 입력 관련 태그들>

-form 태그

 ○ 입력태그들을 묶어주는 태그

 ○ 속성

- action : 요청할 URL - 요청 파라미터를 전송할 CGI의 URL 지정

- method : 요청방식(기본 : GET)

- 기본속성

- name : 전송할 값에 name 값

- 입력태그 : <select>, <textarea>, <input>


- <select> 태그

         ○ 목록 리스트중 선택하도록 하는 태그

         ○ 속성 : multiple : 다중 선택

         ○ 하위태그

-<option> : 선택한 item 등록


-<textarea> 태그

 ○ 여러줄 입력폼

 ○ 속성

- cols : 열수

- rows : 행수


-<input> 태그

○ 다양한 입력폼을 만드는 태그

○ 입력폼의 모양은 Type 속성을 이용하여 지정한다.

○ type

º text : 한줄짜리 text 입력 폼

º password : 패스워드 입력 폼

º checkbox : yes/no를 선택하기 위한 선택 폼

º radio : 여러개중 하나만을 선택하기 위한 선택 폼(여러개중 한개만 선택할 경우 쓰이게 된다)

º file : 전송할 파일을 선택하기 위한 폼

º hidden : 클라이언트에게 보이지 않고 전송할 값을 지정하는 폼

º submit : 전송 버튼

º reset : 초기화 버튼

º button : 그냥버튼(버튼 모양) .javascript와 연동하여 사용한다.

º image : 이미지 전송 버튼

ex)<input type="text">



<직접 HTML구현>

1. WebContent 밑에 form폴더를 만들어준다.


2. 그리고 form폴더에 basic.html을 만들어준다.


3. form 태그를 이용하여 입력태그들을 묶어주게 코딩한다.


4. http://127.0.0.1:8088/myweb/form/basic.html에 들어가면 빈 화면으로 나온다면 성공한 것이다.



5. Select태그를 구현해 볼 것이다. 다음과 같이 구현해본다.


값이 넘어가는 과정은 name="select"로 지정되었기 때문에 select=010과 같이 적용된다.


6. 웹페이지를 실행했을때 다음과 같이 익숙해보이는 화면이 나온다면 성공한 것이다.



7. 만약 사용자가 011을 선택했을때 다른값(SKT)를 보내고 싶다면 <option value="SKT">로 작성하면 된다.



8. 값을 여러개 선택하고 싶다면 select쪽에 multiple을 추가해주면 된다.



9. 다음과 같이 출력된다. 동시에 여러개를 선택하고 싶다면 드래그를 이용하여 지정해주고, 순서적이지 않은 값을 선택하고 싶다면 

ctrl을 이용하여 선택하면 된다.

이렇게 여러 선택된 값들이 넘어갈때에는 select=010&select=017&select=019로 &으로 묶여서 넘어간다.



10. 이번에는 TextArea태그를 이용해보도록 하겠다. 


TextArea코드는 위와 같이 코딩하면 된다.


11. 위 사진과 같이 웹페이지에서 많이 봐오던 텍스트 영역이 나오면 성공한 것이다.


12. 이번에는 TextArea에다가 행과 열 수를 지정해보겠다.


앞에서 언급한것처럼 cols : 열수, rows : 행수를 의미한다. 위와 같은 상황이라면 한줄에 80자를 입력할 수 있으며 

10줄이 늘어난다는 뜻이다.


13. 밑과 같은 그림처럼 텍스트영역이 늘어난것을 확인할 수 있다.


14. 참고로 <TextArea>와 </TextArea> 사이에 문자열을 입력하면 웹페이지에 출력된다. 이게 TextArea의 Default 값이다.



사이에다가 Default값 : 자기소개라고 넣고 돌려보기로 한다.


돌려보았더니 텍스트영역에 Default값 : 자기소개가 Default값으로 같이 출력된다.



15. 참고로 <textarea>와 </textarea>사이는 엔터와 스페이스바를 모두 인식하기 때문에 작성할떄 유의해야 한다. 

다음 그림과 같이 엔터와 스페이스바를 많이 입력해보겠다.



17. 엔터와 스페이스바를 인식하기 때문에 다음과 같이 출력된다. 이에 유의하고 코딩을 해야 한다.


Posted by 김마농

요청 파라미터

 - 클라이언트가 CGI(서블릿)으로 전송하는 데이터

 - CGI가 일처리를 위해 클라이언트로부터 입력 받아야 하는 데이터

 - HTML의 form 태그나 QueryString을 이용해 전송한다.

 - name=value 형태로 전송된다.



Posted by 김마농

javax.servlet.http.HttpServletRequest

- 클라이언트의 요청과 관련된 정보와 동작을 가지고 있는 객체

 - Web Container가 생성하여 service()의 인수로 넘겨준다.

 - ServletRequest의 하위

 - 주요 기능

  º 요청 파라미터 조회

  º HttpSession 객체 조회

  º request scope 상의 component간의 데이터 공유 지원


javax.servlet.http.HttpServletResponse

- 응답할 client에 대한 정보와 동작을 가지고 있는 객체

 - Web container가 생성하여 service()의 인수로 넘겨준다.

 - ServletResponse의 하위

 - 주요 기능

  º 응답 Header 정보 설정(Content type 설정)

  º 응답 Stream 조회

  º Redirect 방식으로 수행 넘기기



Posted by 김마농

Service()가 실행될때마다 카운터 쌓기

1. 우선 클래스를 만들어준다.



2. 다음과 같이 코딩한다.

이 코딩은 서비스가 요청될때마다 카운터가 하나씩 쌓여서 화면에 출력하는걸 의미한다.


3. web.xml도 다음과 같이 코딩해준후 서버를 가동시킨다.


4. http://127.0.0.1:8088/myweb/counter로 들어가서 다음과 같이 나오는지 확인한다.


5. 새로고침 할때마다 서비스가 요청되어 카운터가 쌓이는걸 볼 수 있다.


6. 여러번 새로고침한 상황이다.

하지만 위와 같이 코딩하게 되면 서버를 재 실행하게 되면 카운터는 인스턴스 변수이기 때문에 초기화 된다.


그래서 외부자원을 이용해야 하지만 항상 서비스가 요청될때마다 읽고 쓰기가 되면 계속 작업을 하기 때문에 버벅거리게 된다. 


이 문제를 해결하기 위해 destroy()에 저장하고 init()때 읽어 들이기를해야 한다.


1. Init()와 destroy()를 활용하여 코딩하기로 한다.


2. 우선 Init()를 코딩한다.

 - init()에서는 파일을 읽어서 그 파일안에 있는 값을 로드하는 기능을 한다.





3. 그다음 Destroy()를 코딩한다.

 - destroy()는 visitcount를 저장하는 역할을 하게 된다.


4. 그 다음 서버를 가동시키고 http://127.0.0.1:8088/myweb/counter를 실행하면 다음과 같이 나와야 한다.

밑 사진은 이미 22번째까지 새로고침을 한 것이다.

5. 이제 서버를 재가동하여 값이 제대로 저장되어 불러오는지 테스트한다.



6. 재가동하여 이전에 불러온값 +1이 적용되면 성공적으로 코딩한 것이다.


CounterServlet 소스코드








Posted by 김마농