코딩 학원 27일차(tomcat 사용법, Html + Java)

html/css 작업한 것을 웹 서버에 갖다 놓으면 이용자들이 쓸 수 있다.

 

123.12.43.234 이렇게 ip로 들어오라하면 불편하니 도메인 네임도 구해야 된다.

 

www.ivyro.net

:: 아이비호스팅 - 참 좋은 호스팅 ::

오 뭐야 링크 까지 됬었구나

 

아무튼 저기서 웹호스팅 - 무료호스팅 - 신청하기(로그인 필요)

인코딩 방식 선택
업로드 안 함 선택

 

하면 되는데 도중에 저 사이트 서버가 터져서 올려보진 못했다.

 

HTML과 CSS로 웹사이트를 만들었지만 이 두가지 전부 디자인 언어이기 때문에 아무런 기능이 없다.

그래서 프로그래밍 언어의 기능이 필요하다.

 

Servlet[Server + Applet]
서버에서 실행되는 프로그램
사용자가 요청하면 HTML+CSS를 만들어서 응답해주는 Java프로그램
웹서버 급에서는 실행 불가하며 WAS가 필요하다.

 

웹서버 : html/css 올려놓으면 제공해준다. (위 사이트 처럼 무료가 있음)

 

WAS[Web Application Server] : 웹 서버 + 프로그램 실행 기능 (Java가 되는 웹 서버이며 이런건 무료가 없다)

 

그래서 우리는 강의장 컴퓨터를 WAS로 만들 것이다.
내 컴퓨터를 WAS로 만들어주는 프로그램이 다양하게 있는데 그 중에 우리는 tomcat을 사용할 것이다.

 

apache.org 접속 - Project - Tomcat - 8.5 버전 다운로드 클릭

installer 버전 설치 후 실행 한 뒤 넥스트 누르다가

 

Server Shutdown Port 는 1로 해주고
HTTP/1.1 Connector Port는 이 바닥의 약속으로 웹 서버 포트는 80번을 쓴다.

 

오라클이 8080번을 사용 중이라서 기본값 그대로 하면 충돌이 일어날 수도 있다하셨다.

나머지는 그냥 두고 넥스트 눌러서 설치 완료 한다.

 

그리고 자신의 ip 주소로 브라우저에서 접속해보면 톰캣이 나온다.
(톰캣에서 샘플로 만들어 놓은 HTML이며 정상적으로 설치 되었다면 나온다.)

 

이제 내 컴퓨터는 WAS다. WAS가 왔으

 

이렇게 ROOT 파일로 들어와서 기존에 있던 파일은 전부 지우고
내가 어제 작업했던 것들을 집어넣었다.

 

와아오우우우 ip주소가 어제 만든 홈페이지로 바뀌었다.

 

그리고 방화벽을 다 끄면 강의장의 다른 자리에서는 접속이 가능했다.
다른 지역에서 접속을 하고 싶다면 저번처럼 외부 포트를 뚫는 작업을 해야한다.

 

전기세와 해킹이 감당 가능하다면 본인 컴퓨터를 서버로 만들어도 되긴 한다.

 

configure tomcat에서 was 서버 기능을 껐다 켰다가 가능한데 매번 하기엔 귀찮기에 tomcat 복사본을 만들어서 eclipse와 tomact을 연동 해버리면 된다.

일단은 여기서 stop으로 서버를 끈다.(configure tomcat은 시작 버튼 누르면 나온다.)

기존 window의 tomcat 포트가 80번인데 복사본도 80번으로 하면 충돌이 일어나기에 꺼주는 것이다.

 

eclipse 아랫쪽 Servers에서 여기 파란거 눌러주고

 

tomcat 검색해서 넥스트 해준다.

 

파일경로를 아까 위 tomcat 경로에서 끝까지 들어가지말고 8.5 파일을 선택해준다.

 

그럼 이렇게 서버쪽에 tomcat이 생기는데 우클릭 하면 stop, start가 가능하다.

 

그리고 이제 새로운 프로젝트를 Dynamic Web Project로 만든다.

그리고 이 경로대로 들어가서 WEB-INF 에다가 html 만든다.

eclipse 상단 - window - 브라우저 설정에서 실행은 Chrome로 되게 설정해준다.

body에 대충 아무거나 쓰고 실행을 해본다.

 

정상적인 경우라면 body에 써놓은 내용이 브라우저로 켜질 것이다.

 

처음 한번만 실행 해두면 수정하고 저장하면 알아서 재배포 해준다.
근데 이게 버그 때문에 잘 안 되기 때문에 여러 해결 방법이 있는데.

1. 그때는 다시 실행해야된다.
2. 그래도 안 되면 서버를 껐다켜야된다.
3. 서버를 끄고 다시 실행해도 안 되면 project - clean을 하고 다시 실행.
4. 해도 안 되면 서버 Clean 시키고 다시 실행.
5. 그래도 안 되면 파일명 바꾸고 다시 실행.
6. 그래도 안 되면 프로젝트를 다시 만든다.
7. 그래도 안 되면 워크스페이스 바꾸기.
8. 그래도 안 되면 포맷.

 

그리고 "아참 0번" 하시면서 갑자기 cache메모리가 뭐냔다.

 

데이터를 더 빨리 꺼낼 수 있게 자주 쓰는 프로그램을 담아 놓는 곳인데

0번은 브라우저의 cache메모리를 비우고 새로고침하는 것이다.(shift+새로고침)

 

프로젝트 만들 때 Configuration에 Modify눌러서 

java 버전을 현재 설치된 걸로 바꿔준다. (지 맘대로 바꿔놓은 듯 하다)

 

만들 때 패키지는 꼭 써줘야한다.

 

servlet를 생성하면 알아서 필요한 기능들을 불러와준다. 그리고 이 클래스에서 실행을 하면 웹사이트가 나온다.

 

다시 한번 Servlet[Server + Application]
단순 웹서버에서는 불가하고 WAS에서만 실행 가능하다.
보면 main이 없는데 WAS에 있어서 그렇다.
Servlet 객체를 WAS에서 자동으로 만들어서 실행하는 구조.

 

위에서 부터 하나씩 뜯어보자면

 

Servlet을 만들었으면 tomcat에 등록하는 작업이 필요 - 5.0 까지는 수동으로 해야 됬는데 이제 저 소스가 알아서 해준다. 그래서 저게 없으면 연결이 안 된다.

 

그리고 이 Servlet 클래스를 복사 붙혀넣기 해보라하셨다.
클래스는 정상적으로 복사가 되는데 저 위의 소스 내용이 변경이 안 되서 연동이 안 되는 실수를 진짜 많이 한단다.

 

그리고 바로 밑에 있는 클래스명을 변경해도 위에는 자동으로 변경이 안 되기 때문에 주의해야 한다.

 

이건 그냥 버전표시하는 변수이긴 하나 별 필요는 없다.

 

그냥 생성자, 별로 필요는 없는데 아예 안 쓰진 않는다.

 

클라이언트로 부터 GET 방식 요청 받으면 자동 호출 된다.
주소 검색 혹은 링크 클릭 등 대부분의 브라우저에서 하는 행동들은 GET방식 요청인 것이다.

 

클라이언트로 부터 POST 방식 요청 받으면 자동 호출 됨.
상항이 정해져 있는데 오늘은 아마 못 볼 것이라고 하셨다.

 

Servlet이 이 객체를 생성해서 무한 루프가 도는데 이런 방식을 event-driven programming 이라고 한다.

event loop를 돌다가 특정 이벤트가 발생하면 메소드가 자동호출 되어서 그걸 작업하고 다시 event loop로 복귀하는 구조이다.

빨대(PrintWriter)를 응답(response)에 꽂고 hi를 print 하면 응답할 때마다 hi가 출력된다.

WAS 안에 Servlet가 있는데 사용자가 servlet에 무언가를 요청(get or post)하고 servlet이 요청을 받으면 응답을 해준다. 그 응답 과정에 pw 빨대를 꽂아 넣은 것이라보면 된다. (랜선에 붙어있는 응답용 빨대)

그럼 이제 구구단을 만들라고 하셨다.

이용자가 요청하면 구구단 테이블이 나오도록 말이다.

일단 2단만 만들라고 하셨는데 어차피 9단 까지 만들라고 할 것 같아서 그냥 했다.

반복문 활용의 끝을 보고 있는 기분이다.

String.format을 쓸데없이 쓰다가 갓영덕님이 그냥 printf로 하면 된다 해서 바로 호다닥 고쳐썼다.

그리고 귀찮아도 스타일을 태그 안에 쓰지 말고 정석으로 하라고 하셨다.

 

이거 한번 만들고 바로 들었던 생각인데 분명 현업에서는 이렇게 안 하고 훨씬 편한 방법으로 작업을 할 것이며 강사님은 현재 빌드업 중일 것이라고 말이다.

 

나 같은 경우 한글이 깨진다길래 단이라 안 하고 dan이라고 해놨는데 이 한글 깨짐 현상을 고쳐야 한다.

 

데이터를 보낼 때 전기가 흐르냐 안 흐르냐로만 데이터가 올텐데 servlet이랑 사용자 pc가 사용하는 인코딩 방식이 다르다면 어떡할 것인가?

그래서 쓰는 것이 이것이다. 나 이 인코딩 방식으로 보낼테니 너도 이걸로 받아라는 의미라고 한다.

 

이제 사칙연산 해주는 계산기를 만들어보라 하시곤 인터넷 주소 체계에 대해서 알려주셨다.

 

프로토콜://서버주소:포트/폴더명/폴더명/.../파일명   인데

 

프로토콜[http or https]
서버주소[IP주소 or DN]
포트번호[80번은 생략가능]
폴더명[폴더명 ROOT면 생략가능]
파일명[파일명 index.html이면 생략가능]

 

그리고 뒤에 부수적으로 붙는 것이

변수명=값&변수명=값&변수명=값 -- request parameter [클라이언트가 서버쪽으로 보내주는 정보]

 

json할 때 이 요청 파라메터를 뒤에 붙혀서 자료를 받아왔는데 우리가 이걸 이용해서 사용자에게서 정수 2개를 받아서 값을 출력해보자고 하셨다.

 

request의 기능중 get파라메터로 aaa 라는 파라메터명을 만들어주고 이용자가 이 파라메터에 입력하는 값을 우리는 인트로 바꿔서 받겠다 라는 뜻이다.

 

받은 값으로 html과 식을 만들어준다.

 

그럼 이제 구구단 2차전

 

클라이언트가 단과 글자색 지정 가능하게

 

아까 구구단이랑 파라메터 받는거 복붙 하고
받을 값이랑 변수명, 파라메터명 바꾸고 반복문 바깥거 지운다음 이용자가 입력한 값을 단과 색 자리에 넣어준다.

 

바로 실행하면 아마 오류 창이 뜰 것이다. 뒤에 저 요청 파라메터를 형식에 맞게 꼭 써주어야 정상적으로 열린다.

 

이제 이용자가 입력 칸에 입력하면 알아서 파라메터가 만들어지게 해보자.

그 페이지에 Java의 프로그램스러운게 필요하다면 : Servlet 아니면 : html

일단 html을 만들라고 하셨다.

 

<a> 태그가 어제 페이지 이동이 아닌 파일 열기라고 하셨었는데 이것도 뻥이고 사실 GET방식 요청이라고 한다.

 

실행 시킨 페이지의 저 링크를 누를 경우 5단이 튀어나온다. 이건 넘어가고

 

form속의 button을 누르면 action에 있는 쪽으로 요청한다.
input의 name에 있는 것을 요청 파라메터 변수명으로 사용한다.

 

이렇게 나오는데

값을 입력하고 버튼을 누르면

도메인 주소를 보면 이렇게 요청 파라메터 값을 위의 설명한 방식대로 넣어준다.

 

근데 문득 10억을 넣어서 int를 터뜨리면 어떻게 될까 궁금했서 10억을 넣어봤더니 

 

??? 음수가 뜬다.

궁금해서 질문 했더니 아주 상세하게 설명해주셨는데 이해를 못했는데 다시 물어보긴 죄송해서 그냥 아~ 하고 말았다. 그래서 설명할 수가 없다. 아무튼 신기했다.

 

기본이 get 방식이고 post를 할 수 있는 유일한 수단이 method를 지정해주는 것이다.

 

구구단2 Servlet쪽에 post에 똑같이 코드 복사 붙여넣기 해도 똑같이 돌아가는데 그러면 get과 post가 무슨 차이일까

 

주소창을 보면 요청파라메터가 포스트 방식에는 없다. 아예 없는 것이 아니고 내부적으로 전달하는 것이며 이는 보안성이 get 방식 보다는 높다라고 할 수 있다. (로그인 같은 거 할 때 주로 쓴다.)

 

input 아무거나 추가해보란다.

아무거나 추가하고 post에서도 받아준 다음 input에 한글로 안녕하세요 썼더니 이렇게 나온다.

 

아까 우리가 보낼 때 뭘로 보냈는지 안 알려줘서 한글이 깨졌던 것 처럼 이용자가 요청할 때 뭘로 요청했는지 몰라서 한글이 깨진 것이다. 그래서 위 소스를 추가해주어야 한다.

 

그래도 글자가 깨져서 나온다.

원칙적으로 인터넷 주소에는 한글을 쓰면 안 되는데 

보면 이렇게 tomcat이 자동으로 변환을 해준다. 근데 우리는 지금 euc-kr을 쓰는데 이상한 인코딩 방식으로 변환한다.

 

tomcat 파일 server.xml 파일을 열고 찾기로 20000을 치면 63번줄에 있다.

 

이렇게 get 방식으로 값을 받아올 때 euc-kr로 받아오라는 의미의 소스를 적어준다.

 

????로 나오던 텍스트가 정상적으로 나온다.

 

이제 오랜만에 비만도 검사를 해보자 하셨다.

 

이름
키
몸무게
버튼
웹사이트에 input창이 나오고 입력 후 누르면 

이름 : 뭐
키 : 뭐
몸무게 : 뭐
bmi : 뭐
비만 or 정상입니다.
뜨게 하는데 비만 이상일 경우 글씨가 빨간색으로 나오게.

 

어떻게든 입력 시 출력은 했는데 빨간색을 어떻게 해야되는건가 감도 안 잡힌다. 그러다가 if 문을 pw.print에 주면 되지 않을까 하는 생각이 번득들었다.

 

위에 head 부분에 css 태그 만들고 class에 속성 부여 해놓은 다음
비만이라는 글자를 포함하고 있을 때만 클래스가 부여된 tr이 출력되게 했다.

 

근데 중도비만 부터 빨간색이라고 하셨던거라 조건문을 bmi >=30 으로 바꿨다.

 

강사님 소스는 if문을 굳이 두번 돌릴 필요 없이 스타일에 id를 2개 만들어 놓고 위에 비만 판정 조건문 돌릴 때 string id 변수하나 만들어서 중도비만 이상일 때만 아이디에 레드가 부여되는 값이 들어가고 미만일 때는 블랙이 들어가게 하셨다. 그리고 비만판정 쪽 printf에서 id 값을 넣어준다. 이게 더 좋은 방법으로 보였다.

 

입력페이지
날짜 2001-12-31 입력하면
------------
무슨요일인지 출력되게 토요일은 파랑, 일요일은 빨간색으로 말이다.

 

처음에 일요입니다. 라고 잘 나오길래 된줄 알았더니 날짜 한번 바꿔보니까 전부 일요일로 나온다.
여쭤보니까 YYYY 대문자로 적었던게 화근이었다. yyyy로 써야 정확히 원하는 값이 들어간다.

 

그리고 최종 출시 까지 해보자면 이 html 파일명을 index.html로 바꾼다.

프로젝트 export에서 war 파일로 export 하고 경로는 적당히 아무데나 설정 후 파일명은 ROOT.war로 그리고

 

저기 체크는 해제한 상태로 한다.

그리고 이걸 서버로 보내면 된다.

 

이 경로의 기존 루트 파일을 지우고 여기에 넣어준다.

 

그리고 아까 configue Tomcat을 실행시켜준다.

그러면 알아서 ROOT 파일을 압축해제해준다. 그리고 내 ip로 접속해주면 아까 그 html이 잘 나온다.

자 이제 servlet을 통해 Java 기능을 갖춘 브라우저를 만들어봤는데

과연 네이버 같은 회사에서도 이렇게 프로젝트를 만들까 웹 페이지를 정말 이 개노가다로 작업을 했을까?

작업도 불편할 뿐더러 그렇게 강조했던 MVC 패턴은 어떻게 할 것인가?

이제 앞으로 배우며 해결해나가야할 내용들이다라고 하셨다.

역시 오늘 한 것들은 빌드업이였다.

내일은 일단 겁나 말 안 듣는 이용자들을 위한 것을 배울 것이라고 하셨다.