[20221004] JSP 설치, 환경세팅, 기초

kangsun·2022년 10월 4일
0

JSP

목록 보기
1/16

JSP


[JSP 수업내용]

  • 웹의 동작
  • 톰캣 WAS 설치
  • JSP 기본 문법(연산자, 제어문, 배열, 함수)
  • JSP의 내부객체 (성적테이블 CRUD, 자바빈 기반의 성적테이블 CRUD)
  • myweb 프로젝트(개인별) : 답변형게시판,로그인,포토갤러리,문의게시판
  • cafe24 웹호스팅

[교재]

처음해보는 Servlet&JSP 웹프로그래밍

[Server]

  • 요청을 받아들여서 어떤 정보를 제공해 주는 시스템
  • Database Server : Oracle 18c XE, MariaDB, MySQL DB
  • Web Application Server(WAS) : HTTP 프로토콜 기반
  • Mail Server(SMTP/POP3)

[Web Application Server]

  • 네트워크에서 HTTP 프로토콜 기반으로 요청, 응답이 가능한 시스템
  • IIS : 유료. ASP. Microsort사
  • JBoss/Resin : 유료. JSP
  • Tomcat : 무료. JSP (이걸로 사용)
  • Linux기반의 웹서버 : 무료. PHP

[Tomcat WAS]

[Tomcat 서버 포트 수정]

  • tomcat-9.0/conf/server.xml을 수정한다. 69번 라인 근처
    . Oracle 9i이상은 Apache, XDB가 설치되어 있어 8080포트를
    이용하기 때문에 포트 충돌을 막기위해 8080을 사용하지않고
    9090 포트로 변경한다.

    <Connector port="9090" protocol="HTTP/1.1" 
               connectionTimeout="20000" 
               redirectPort="8443" URIEncoding="UTF-8" />

[Tomcat 서버 작동 확인]

[Dynamic Web Project 생성]

  • Dynamic Web Project -> Project name : basic04_web

  • [Backend]
    src/main/java -> .java
    build/classes -> .class

  • [Frontend]
    src/main/webapp -> .html .css .js .jsp 이미지들

  • WEB-INF\lib : 자동생성되며, 관련 드라이버 복사해서 사용한다.

  • WEB-INF\web.xml : 환경 설정 파일이며, 자동 생성 된다.




Server


  • Database Server - Oracle XE 18c

  • 자료를 요청하고 요청을 받으며 응답하는 시스템

  • Mail Server(pop3, smtp-send mail)
    [메일 서버 세팅하는 방법]
    1) 내가 세팅하기
    2) 빌려쓰기
    ex) kim@naver.com / lee@itwill.com(조직, 기관명)
    본인 기관명을 쓰기위해서는 서버를 빌려 사용하는 것이다.

  • Web Server (Tomcat, JBoss, Resin, IIS~~)

    - front-end에서 페이지를 요청하면 (Request)
    - back-end에서는 HTML문서로 답을 준다. (Response)

- Web Server + WAS + Database를 연결
- 요청한 문서가 jsp, asp, php, py면 웹 서버에서 html로 번역해서 응답한다. (상대방은 브라우저에서 확인해야하기 때문)




Protocol 프로토콜 개념


프로토콜

  • 서로 다른 컴퓨터 간의 의사소통을 위한 통신 규약
  • 운영체제도 다를수 있고, 모바일 장비와 PC, 다양한 하드웨어와 다양한 운영체제간에 서로 데이터를 주고받으려면 미리 약속을 해야 함
  • 컴퓨터끼리 정보를 주고받을 때의 통신방법에 대한 약속

프로토콜의 종류

  • TELNET : 텍스트 기반의 원격접속 서비스 (putty.exe 사용)
  • IP (Internet Protocol)
  • TCP(Transmission Protocol)
  • UDP(User Datagram Protocol) - 방송국
  • FTP(File Transfer Protocol) - 파일 전송
    ex) 알drive, Filezilla, ...
  • SMTP(Simple Mail Transfer Protocol) - 이메일
  • POP3(Post Office Protocol) - 이메일
  • DHCP(Dynamic Host Control Protocol) - 유동IP
  • ARP(Address Resolution Protocol) - IP 주소를 물리적 주소로 변환

HTTP(Hyper Text Transfer Protocol)

- 웹서비스. 웹브라우저에서 hyper text 문서를 교환하기 위한 프로토콜
- 인터넷에서 하이퍼텍스트(hypertext) 문서를 교환하기 위하여 사용되는 통신규약이다.
- 하이퍼텍스트는 문서 중간중간에 특정 키워드를 두고 문자나 그림을 상호 유기적으로 결합하여 연결시킴으로써,
서로 다른 문서라 할지라도 하나의 문서인 것처럼 보이면서 참조하기 쉽도록 하는 방식을 의미한다.
- Server에 저장되어 있는 데이터를 사용자가 요청하면 그때마다 데이터를 보여주기 위해 사용 되는 Protocol이다

HTTPS(HyperText Transfer Protocol over Secure Socket Layer)

- 월드 와이드 웹 통신 프로토콜인 HTTP의 보안이 강화된 버전이다.

TCP와 UDP

TCP : 연결된 상태에서 데이터를 전송함. 데이터가 정확히 전달되지 않으면 재전송해야 함
UDP : 연결되지 않은 상태에서 일방적으로 데이터 전달

IP(Internet Protocol) Address와 Mac Address

IP Address : 172.16.83.100
MAC Address : 90-2B-34-66-F7-41
16진수 12자리로 구성, 앞의 3세트는 제조사 고유코드
나머지 3세트는 장치 일련 번호로 구성됨




IP and Port의 이해


IP Address. . . . . : 172.16.203.31

  • 접속 위치를 나타내는 프로토콜
  • IP는 항구와 같은 위치 정보에 해당하며 컴퓨터를 구분하는 용도로 사용.
  • Port는 항구에서 짐을 실어 나르는 부두(port)와 같으며 네트워크로 접속되는 지점을 말합니다.
    전산에서는 하나의 IP에 할당된 여러개의 네트워크 프로그램을 구분하는 용도로 사용.
    하나의 포트는 하나의 프로그램과 매핑(연결)됨.
  • IP 하나당 사용 가능한 포트 : 0 ~ 65535 (2Byte)
  • 알려진 사용할 수 없는 포트
    20, 21 : FTP, 파일 전송
    22 : Secure Shell 접속
    23 : Telnet, 원격 접속
    25 : SMTP, 메일 전송
    80 : HTTP, Apache, IIS등 웹서버, 인터넷 웹 페이지 서비스
    3306 : MySQL 기본 포트, DBMS
    1521 : Oracle 기본 포트, DBMS
    8080 : Apache, 기타 웹 서버 (오라클과 겹쳐있음, 톰캣에서 바꾸기)
    1433 : MS-SQL 기본 포트, DBMS
  • 1500번 이하는 시스템이 사용하는 포트가 많음으로 1500번 이상 사용을 권장합니다.

자기 자신의 PC를 지칭하는 IP(127.0.0.1)와 도메인(localhost)

http://127.0.0.1
http://localhost


ip주소

  • IPv4 : 네칸으로 구성된 ip번호
    - 0~255 사이의 숫자로 구성되어 있다.
    - 현재는 번호가 고갈되어 IPv6을 사용하고 있다.

내 pc ip주소 확인하는 방법

  • cmd → >ipconfig → ipv4 주소 확인





Tomcat 9 설치 (window)


Tomcat 다운로드

https://tomcat.apache.org/

↳ tomcat 8버전은 너무 낮고 jdk11 버전 이상은 Tomcat9 버전 이상을 사용하는게 낫다.

↳ zip파일로 다운받기


↳ 톰캣파일의 내부구조

  • /conf : 이 부분을 수정해줘야한다.


Tomcat 다운로드 후 설치 경로

  • 알집파일은 setup폴더 안에

    I:\java202207\setup


  • 압축풀기 파일은 java202207 폴더 안에

    I:\java202207


톰캣 원본 프로그램 찾기

I:\java202207\apache-tomcat-9.0.67\bin\startup

  • startup window 배치파일
    - 내가 command창에서 실행시키고자하는 명령어를 모아둔 파일

  • 클릭 후 엑세스 허용해주기 (아직 에러남)

  • 에러나는 이유 : 오라클과 포트번호가 겹치기 때문.
  • 톰캣에서 서버 포트 수정하면 된다.
  • [Tomcat 서버 포트 수정]
    - tomcat-9.0/conf/server.xml을 수정한다. 69번 라인 근처 . Oracle 9i이상은 Apache, XDB가 설치되어 있어 8080포트를 이용하기 때문에 포트 충돌을 막기위해 8080을 사용하지않고 9090 포트로 변경한다.

    <Connector port="9090" protocol="HTTP/1.1" 
               connectionTimeout="20000" 
               redirectPort="8443" URIEncoding="UTF-8" />


↳ visual studio로 열기

↳ port="8080" 을 "9090" 포트로 변경한다.

↳ 저장 후 startup window 배치파일 다시 실행
I:\java202207\apache-tomcat-9.0.67\bin\startup



startup window 배치파일 종료하지 말고 Tomcat 서버 작동되고 있는지 확인

http://127.0.0.1:9090
http://localhost:9090
http://172.16.81.100:9090 (내 PC 고정IP 확인방법은 바로 밑에)
↳ 세 개의 주소 중 하나에 접속

접속 확인

↳ 이 사이트 화면이 뜨면 정상 작동되는 것




Tomcat v9.0 port 8080 에러


"Port 8080 required by Tomcat v9.0 Server at localhost is already in use."
8080 port가 이미 사용되고 있다는 의미이다.
jdbc 할 때 오라클에서 이미 8080포트를 사용해서 서버 오류가 나는 것이다.



해결방법





Tomcat 9 설치 (mac)


참조 블로그
https://lasbe.tistory.com/69

https://tomcat.apache.org/

Tomcat 9 → core → tar.gz 파일 다운받기



압축파일 setup 폴더에 넣기

/Users/kangseonlee/Desktop/itwill/java202207/setup


압축해제한 폴더 java202207 폴더에 넣기

/Users/kangseonlee/Desktop/itwill/java202207


Dynamic Web Project 생성 후 톰캣 연결


↳ Dynamic Webproject 클릭


↳ Project name 작성 후 Next


↳ Next


↳ Generate web.xml deployment descriptor 체크 후 Finish




ip주소 확인 (window, mac 동일)


  • IPv4 : 네칸으로 구성된 ip번호
    - 0~255 사이의 숫자로 구성되어 있다.
    - 현재는 번호가 고갈되어 IPv6을 사용하고 있다.

내pc ip주소 확인하는 방법

  • window

  • cmd → >ipconfig → ipv4 주소 확인
    ↳ 학원 pc는 정해진 ip주소를 사용하지만 내 개인pc ip주소는 유동적으로 바뀔 수 있다.

  • http://192.6.14.16:9090 여기로 들어가서 확인


  • mac

    wifi 아이콘 클릭 → 네트워크 환경설정 ...

    ip 주소 확인






ping test


서버의 IP정보도 확인하고 통신이 원할한지 파악하기 위해 사용.

>ping 172.16.83.254 허브와 통신을 하고 있는지 확인
>ping mbc.com 외부와 통신
>ping goole.com 외국사이트
>ping daum.net 악용하는 사례가 많이 있어서 대부분 막아놓음
ping에 답변하는라 속도가 느려지기 때문에 대부분 포털사이트 막아놓음

  • >ping goole.com

    ↳ 정상 확인




eclipse에서 Tomcat 연동 (window, mac 동일)


Java EE 켜기

이클립스에서 톰캣 연동

  • Window → Preferences → Server → Runtime Environments → Add → Apache Tomcat v9.0 → Next → Browse... → apache-tomcat-9.0.67 설치 폴더 선택






    apply and close

톰캣서버 복사

Servers 탭 → New → Apache Tomcat v9.0 → finish
후에 run 시키기
- Servers 탭

- run




프로젝트 기본 설정 및 JSP 템플릿

  • 기본 인코딩 urf-8로 변경









Dynamic Web Project 생성

  • Dynamic Web Project -> Project name : basic04_web

  • [Backend]
    src/main/java -> .java
    build/classes -> .class

  • [Frontend]
    src/main/webapp -> .html .css .js .jsp 이미지들

  • WEB-INF\lib : 자동생성되며, 관련 드라이버 복사해서 사용한다.

  • WEB-INF\web.xml : 환경 설정 파일이며, 자동 생성 된다.

    ↳ 빈칸 우클릭

    ↳ Next

    ↳ Next


    [context root]
    빨간색 - (사용자들 접속 경로) <-
    파란색 - (실제 물리적 경로) <- 파일저장

WEB-INF 정보



basic04_web 프로젝트에 jsoup-1.15.3.jar, ojdbc8.jar 파일 옮기기



webapp폴더에 폴더 생성



index.html 파일 생성



결과확인

위에 파일 생성까지 한 후
http://127.0.0.1:9090/basic04_web/index.html
에 접속하면 접속이 되지 않는다.

→ 서버 run해야 정상작동된다.

server 탭에서 Tomcat v9.0파일 우클릭


톰캣은 무료이기 때문에 한개의 서버만 가능하다.
무료의 한계..

basic04_web 한개만 오른쪽 칸으로 옮겨준 후 finish 클릭

Tomcat v9.0 우클릭해서 start 클릭


콘솔창에 이렇게 뜨면 정상적으로 실행되었다는 의미


http://127.0.0.1:9090/basic04_web/index.html
여기로 접속해서 확인


결과확인 방법 2번째





이렇게 확인할수도 있다.


결과확인 - 핸드폰으로 확인

와이파이 켜고

http://127.0.0.1:9090/basic04_web/index.html
http://localhost:9090/basic04_web/index.html
http://192.168.14.16:9090/basic04_web/index.html

주소에 접속하기





JSP 기본문법


webapp 폴더에 basic 폴더 만들기



JSP 파일 생성 : 01_JSP기본문법.jsp

01_JSP기본문법.jsp 파일 Run As



Run As 할 때 Chrome으로 여는 방법



오류 아닌데 빨간줄 뜨는 것 해결방법

The superclass "javax.servlet.http.HttpServlet" was not found on the Java Build Path

1) servlet-api.jar 파일 lib폴더에 복사하기

  • I:\java202207\apache-tomcat-9.0.67\lib
    servlet-api.jar 파일 복사

  • basic04_web\src\main\webapp\WEB-INF\lib
    폴더 안에 붙여넣기하기

  • refresh, valiade, clean까지 하고 안되면 이클립스 껐다켜기

2) Properties -> Add Library

참조 블로그
https://hongeui.tistory.com/13

  • 해당 프로젝트 우클릭 → Properties


  • Java Build Path → Libraries → Modulepath → Add Library...


  • Server Runtime → Next


  • Apache Tomcat v9.0 → Finish


  • Apply and Close





01_JSP기본문법.jsp


  • <%-- --%> : JSP 코드 주석
  • Ctrl+Shift+/ : JSP 주석 자동 코드

한글 인코딩

→ 섞어 쓰지 않도록 주의

  • 조합형(UTF-8) : 초성+중성+종성으로 조합. 더 많은 한글 표현이 가능
  • 완성형(EUC-KR) : MS949

인코딩 모두 통일시켜야한다.


JSP Directive 지시자

  • <% page %>
  • <% include %>
  • <% taglib %>


페이지 소스보기를 보면 JSP 문법은 보이지 않는다.
HTML 로 응답받기 때문임




02_표현식.jsp


1) 출력

  • JSP
  • 웹브라우저
  • 페이지소스보기

    ↳ 페이지 소스보기에서 확인하면 HTML 태그만 보인다.
    ↳ WAS로 인해 해석본만 출력이 된다.


2) 표작성 출력

  • JSP
  • 웹브라우저
  • 페이지소스보기



3)표현식(Expression) : out.print() 단축키

<%= %> : out.print() 단축키

  • JSP

  • 웹 브라우저

    ↳ 2) 표작성 출력 과 동일한 결과가 나온다.

  • 페이지 소스보기





03_표현식.jsp


  1. https://www.w3schools.com/bootstrap/bootstrap_tables.asp
  2. https://www.w3schools.com/bootstrap/tryit.asp?filename=trybs_table_contextual&stacked=h

.w3schools에 있는 bootstrap style table 복사 붙여넣기

  • JSP
  • 테이블 디자인 삽입


  • 웹 브라우저

  • 반복문 넣어서 이름, 국영수,평균, 등수 정보 넣기

  • 웹 브라우저 확인

  • <thead>

  • <tbody>



과락, 별, 장학생 찍기

  • JSP

    ↳ td 태그 안에 <% %> JSP 문법 태그를 넣어 for문으로 결과값을 찍는다.

  • 웹 브라우저

  • 페이지소스보기

JSP 작성 분석




cafe24 호스팅
https://hosting.cafe24.com/?controller=new_product_page&page=language

버전 업그레이드하기

이걸로 6개월.. 결제하기!

profile
코딩 공부 💻

0개의 댓글