☭DEVELOPER/#2 웹개발(자바기반 풀스택)

JAVA 설치 / 아파치 톰캣

조반짝 2023. 8. 1. 18:21
728x90
반응형

 


JAVA8

JAVA 설치

자바 설치완료 후 컴퓨터에 설치되었는 지 확인하기

CMD > java -version 

아래 처럼 뜨면 설치 완료됨

 

windows + r > sysdm.cpl: 시스템 속성 실행 > 고급 > 환경변수 > 새로만들기 > 

windows + R  > CMD

java -version [엔터] javac-version[엔터]

자바 설치 완료!

 

아파치 톰캣 

아파치 톰캣은 웹 서버와 연동하여 실행 할 수 있는 자바 환경을 제공해서 JSP(java server page)와 자바 servlet이 실행할 수 있는 환경을 만들어주고있다. 

 

아파치톰캣은 자바를 먼저 깔고 설치해야함

 



설치 후에 하단메뉴표시줄에 오른쪽 configure 클릭 

 

stop 선택

 

Java, Apache Tomcat 환경 변수 설정

자세히보기


1. JAVA_HOME 환경 변수 설정(필히! JDK 설치 후에 진행해야 함)

  1) 윈도우즈키 + R키 - sysdm.cpl - 고급 - 환경 변수 - "시스템 변수" 에서 "새로 만들기" 버튼 클릭

     - 변수 이름란에 JAVA_HOME 입력, 변수 값란에서 "디렉터리 찾아보기 " 버튼 클릭

     - C:\Program Files\Java\jdk1.8.0_221 폴더 선택
  
     * 참고 : 시스템 변수(모든 접속 계정에 환경 변수 설정을 적용함), 사용자 변수(해당 접속 계정에만 환경 변수 설정을 적용함)

  2) 변수 칼럼명에서 Path 선택 - 편집 - 새로 만들기 - %JAVA_HOME%\bin 입력 - 확인 - 확인 - 확인

  3) 윈도우즈키 + R키 - cmd - Ctrl+F 찾기에서 jdk1.8.0_221 입력해서 Path 경로 설정을 확인해 봅니다.

2. JRE_HOME 환경 변수 설정(필히! JRE 설치 후에 진행해야 함)

  1) 윈도우즈키 + R키 - sysdm.cpl - 고급 - 환경 변수 - "시스템 변수" 에서 "새로 만들기" 버튼 클릭

     - 변수 이름란에 JRE_HOME 입력, 변수 값란에서 "디렉터리 찾아보기 " 버튼 클릭

     - C:\Program Files\Java\jre1.8.0_221 폴더 선택
  
     * 참고 : 시스템 변수(모든 접속 계정에 환경 변수 설정을 적용함), 사용자 변수(해당 접속 계정에만 환경 변수 설정을 적용함)

  2) 변수 칼럼명에서 Path 선택 - 편집 - 새로 만들기 - %JRE_HOME%\bin 입력 - 확인 - 확인 - 확인

  3) 윈도우즈키 + R키 - cmd - Ctrl+F 찾기에서 jre1.8.0_221 입력해서 Path 경로 설정을 확인해 봅니다.

3. CATALINA_HOME 환경 변수 설정(필히! ApacheTomcat 설치 후에 진행해야 함)

  1) 윈도우즈키 + R키 - sysdm.cpl - 고급 - 환경 변수 - "시스템 변수" 에서 "새로 만들기" 버튼 클릭

     - 변수 이름란에 CATALINA_HOME 입력, 변수 값란에서 "디렉터리 찾아보기 " 버튼 클릭

     - C:\Program Files\Apache Software Foundation\Tomcat 9.0 폴더 선택
  
     * 참고 : 시스템 변수(모든 접속 계정에 환경 변수 설정을 적용함), 사용자 변수(해당 접속 계정에만 환경 변수 설정을 적용함)

  2) 변수 칼럼명에서 Path 선택 - 편집 - 새로 만들기 - %CATALINA_HOME%\bin 입력 - 확인 - 확인 - 확인

  3) 윈도우즈키 + R키 - cmd - Ctrl+F 찾기에서 Tomcat 9.0 입력해서 Path 경로 설정을 확인해 봅니다.

4. CLASSPATH 환경 변수 설정(필히! ApacheTomcat 설치 후에 진행해야 함)

  1) 윈도우즈키 + R키 - sysdm.cpl - 고급 - 환경 변수 - "시스템 변수" 에서 "새로 만들기" 버튼 클릭

     - 변수 이름란에 CLASSPATH 입력, 변수 값란에서 다음의 내용 입력하고 확인 버튼 클릭

    .;C:\Program Files\Java\jdk1.8.0_221\lib\tools.jar;C:\Program Files\Apache Software Foundation\Tomcat 9.0\lib\servlet-api.jar

     * 참고 : 시스템 변수(모든 접속 계정에 환경 변수 설정을 적용함), 사용자 변수(해당 접속 계정에만 환경 변수 설정을 적용함)

  2) 변수 칼럼명에서 Path 선택 - 편집 - 새로 만들기 - %CLASSPATH% 입력 - 확인 - 확인 - 확인

  3) 윈도우즈키 + R키 - cmd - Ctrl+F 찾기에서 servlet-api.jar 입력해서 Path 경로 설정을 확인해 봅니다.


1. 아파치 톰캣 웹사이트 접속

   http://tomcat.apache.org/

2. 좌측 Download - Tomcat 9.0 선택 - Core : 32-bit/64-bit Windows Service Installer (pgp, sha512) 다운로드


3. 실행 관련 폴더 확인

  1) 웹 서버 관리 명령어 프로그램
     C:\Program Files\Apache Software Foundation\Tomcat 9.0\bin

  2) 웹 문서 또는 웹 프로그램 저장 기본 위치 확인
    C:\Program Files\Apache Software Foundation\Tomcat 9.0\webapps

4. 톰캣 웹 서버의 기본적인 실행과 환경 설정
   1) 시작 - 모든 프로그램 - Apache Tomcat 9.0 [Monitor Tomcat] 실행함
      Monitor Tomacat 에서는 웹 서버의 서비스 상태를 확인할 수 있음
      시작 유형(Startup type)은 기본적으로 자동(Automatic)으로 되어 있기 때문에 컴퓨터를 사용하기 시작하면 웹 서버 서비스가 자동으로 시작됨.
      시작 유형이 '자동(Automatic)'인지 확인하고, 만약 서비스 상태(Service Status)가 중지됨(Stopped)이라면 <Start>를 클릭하여 시작됨(Started)으로 변경해 줌.
  
   2) 시작 - 모든 프로그램 - Apache Tomcat 9.0 [Configure Tomcat] 활용함

5. 톰캣 서비스 동작 확인

  1) 내 PC에서 localhost 주소 확인하기

    C:\Windows\System32\drivers\etc 폴더에서 hosts 파일을 열어서 localhost 및 127.0.0.1 주소 정보를 확인함

  2) 웹 브라우저에서 http://localhost:8080/ 실행해 봄 (webapps 폴더의 ROOT 폴더에 저장된 index.jsp 페이지가 실행되는지 확인함)

6. 톰캣 웹 서비스 라이브러리 및 설정 파일 사용 시스템 변수 등록

  1) 변수 이름 : CATALINA_HOME

  2) 변수 값 : C:\Program Files\Apache Software Foundation\Tomcat 9.0

7. 톰캣 시스템 변수 등록 후 기존 시스템 변수인 Path 변수에 톰캣의 bin 디렉토리 등록함

  1) 변수 이름 : Path

  2) 변수 값 : %CATALINA_HOME%bin

  [Path 설정은 C:\Program Files\Apache Software Foundation\Tomcat 9.0\bin 으로 해도 됨]

8. 기본 포트 번호를 HTTP 기본 포트인 80 번으로 변경

   [Tomcat 8.5]-[conf] 폴더 안에 server.xml 파일 열어서 변경함
   (기존)  <Connector port="8080" protocol="HTTP/1.1"

   (변경)  <Connector port="80" protocol="HTTP/1.1"

9. 웹 서버 홈 디렉토리와 가상 디렉터리 설정
   1) 새로운 폴더를 생성하여 가상 디렉터리 생성
     톰캣 서버의 [webapps] 폴더에 새로운 폴더 [webui] 폴더를 생성하고 index.html 문서를 만들어서 넣어줌.
   2) 웹 브라우저에서 가상 디렉토리의 웹 서비스 http://localhost/webui 경로로 접속되는지 실행 확인함
   3) 여러 웹 문서 중 자동으로 인식하는 기본 문서는 index.html, index.htm, index.jsp 세 가지 이며,
      세 가지 파일이 모두 있을 경우, 앞에서부터 우선순위를 매겨 기본 문서로 참고함
   4) 새로운 가상 디렉터리 webui에서 webui.html을 기본 문서로 인식하도록 하기 위해서는 web.xml 파일을 수정하면 됨
    [web.xml 파일 수정 : <welcome-file-list> 태그 하단에 다음의 내용을 넣어줌]
   <welcome-file-list>
<welcome-file>webui.html</welcom-file>
<welcome-file>index.html</welcom-file>
<welcome-file>index.htm</welcom-file>
<welcome-file>index.jsp</welcom-file>
   </welcome-file-list>


   5) 톰캣 웹 서비스가 새로운 가상 디렉터리 및 기본 문서를 인식하지 못할 경우, 톰캣 서버 재시작해 줌.

10. 톰캣 서버 환경에서 server.xml 파일을 변경해서 가상 디렉터리를 홈 디렉터리로 설정함
   앞서 [webapps] 폴더 이외에 [mobileweb]라는 폴더를 생성해서 활용하고 싶다면, URL에서 이 디렉터리를 홈 디렉터리로 인식하거나 가상 디렉터리로 인식하게 해야 함
   [Tomcat 8.5]-[conf] 폴더에 저장된 server.xml 파일에서 <Server> 태그 - <Host> 태그 하단에 다음과 같이 추가해서 수정하고 저장함

   [server.xml 파일 수정]
  <Host name="localhost"  appBase="webapps"
            unpackWARs="true" autoDeploy="true">

 (추가) <Context path = "/webui" docBase="C:\webui" reloadable="true" />

11. 새로 생성한 [mobileweb] 폴더에 index.html 문서를 만들어 저장하고 톰캣 버서의 서비스를 중지했다가 다시 시작함. 그리고 웹 브라우저 실행하여 확인함.

     http://localhost/mobileweb/

12. 앞서  server.xml 파일 수정 시 path 속성은 URL에서 인식하는 상대 경로를 나타내며, docBase 속성은 실제 웹 문서가 존재하고 있는 절대 경로(혹은 물리적 경로)를 나타냄.

    따라서 물리적 경로가 C드라이브 아래 [webindex] 폴더일 경우, 상대 경로명을 path="/webui"으로 수정하면 웹 브라우저에서 URL을

    http://localhost/webui/ 이라고 사용할 수도 있음

   [server.xml 파일 수정]

  <Context path = "/webui" docBase="C:\webindex" reloadable="true" /> 


※ GET/POST 웹 페이지에서 한글이 깨지는 현상이 발생하면,
   톰캣 서버의 conf 폴더 – server.xml 파일에 URIEncoding=“EUC-KR”을 추가하고
   톰캣 서버를 재시작해 주면 됨.
   <Connector port=“80” protocol=“HTTP/Part1.1”
        connectionTimeout=“20000”
     redirectPort=“8443” URIEncoding=“EUC-KR” />

 


1. 이클립스 톰캣 서버 추가
   이클립스 상단 메뉴에서 [Window] - [Preferences] - [Server] - [Runtime Environments]에 들어가서
   설치한 톰캣을 지정하기 위해 'Add' 버튼을 눌러줌.

2. Apache 폴더의 'Apache Tomcat v9.0' 버전을 선택하고 'Create a new local server'를 체크한다.
   그렇게 되면 이클립스 하단의 Servers 탭에서 톰캣 서버가 추가된다. 'Next >' 버튼을 눌러줌.

  톰캣을 설치했던 디렉터리를 입력하고, 디폴트 실행환경을 JDK로 변경한 뒤 'Finish' 버튼을 누른다.
  톰캣 서버가 등록되었다. 해당 서버를 선택하고 'Apply and Close' 버튼을 누르면 창이 닫히게 됨.
  그리고, Window - Show View - Server - Servers 선택하면
  이클립스 하단의 Servers 탭에서 톰캣 서버가 추가된 것을 확인할 수 있다. 아직 실행하지 않았기 때문에 Stopped 된 상태임.
  화면에서 톰캣 서버를 우클릭한 후 'Start'를 누르거나, 혹은 단축키로 'Ctrl+Alt+R'을 누르면 톰캣 서버가 실행됨.

  포트 충돌 에러 발생 시 우측 상단
  Port Name
  Tomcat admin port 8079(임의 설정)
  HTTP/1.1              8000(임의 설정)

  좌측 중앙
  Server Locations
  Use Tomcat installation (takes control of Tomcat installation) 체크함.

3. Dynamic Web Project 생성하고, WebContent 폴더에 index 파일 및 웹 파일, 폴더들을 넣어줌
   Tomcat v9.0 Server 우클릭하여 Dynamic Web Project와 연결해줌.
   index.html 파일 열어서 마우스 우클릭 - Run-On-Server 실행해 줌.

   이제 웹브라우저에서 http://localhost:8080/ 주소를 검색해서 들어간 후 웹 페이지가 실행되는지 확인해봄.

 


GET 방식

<!DOCTYPE html>
<html lang="ko">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Get 방식</title>
</head>
<body>
    
    <h2>GET방식으로 데이터전송</h2>
    <form action="01_getdata.jsp" method="get">
        <p>이름: <input type="text" name="name"></p>
        <p>전공: <input type="text" name="subject"></p>
        <p>비밀번호: <input type="password" name="password"></p>
        
        <input type="submit" value="전송!">
        <input type="reset" value="취소!">
    </form>
    
</body>
</html>

폴더 복사하기

C:\Users\guro-hi\Downloads\5강) 프론트앤드 HTML5_Form_GET_POST_요청_파라미터_with_JSP (1)\1_source_VSCode_Study 폴더 안에 html5 폴더 안에 소스 코딩\html5\get_post_source\webapps

해당 폴더에 붙여넣기

C:\Program Files\Apache Software Foundation\Tomcat 9.0\webapps

아파치 톰캣 실행

메뉴표실줄 오른쪽 하단에 아파치 톰캣 아이콘 오른쪽 마우스 누르고 Configure를 누르면 아래창이 뜨고

start를 누른다.

cmd 창에 ipcofig로 IP 주소를 확인하고 CHROME에 주소를 붙여넣는다.

접속이 안될때 IP주소 뒤에 :8080 추가해서 접속하면 화면이 뜬다.

아파치 톰캣 9.0 써야한다.

주소창에 http://192.168.0.48:8080/get/01_getdata.jsp 를 넣으면 vscode에서 작성한 내용이 출력된다.

주소창주소를 복사해서 action에 붙여넣기한다.

get 폴더에서 01_getdata.jsp 를 열어준다.

vscode 창이 열린다. song을 name으로 대체한다.

CSS 보여줌

BACKEND 방식

GET 방식과 POST 방식의 차이점

 

GET 방식

쿼리스프링사용 : 안에 내용이 다 보여짐

검색 조회할 때 사용(데이터가 오픈되어있음)

조회는 겟방식으로 처리

POST방식

회원가입 등록, 게시글 등록, 회원정보수정, 게시글 수정, 게시글 삭제, 회원탈퇴 시 사용 

등록, 정보에 민감한 사항들은 포스트 방식

method="get" > method="post" 로 변경

주소창에 정보가 없다.

 

 

면접시,
POST방식/ GET방식의 차이점 물어볼 수 있음 

긴장을 해서 말하기 힘들면 경험을 말하면 된다. 프로젝트 시에 역할을 용어를 말하며 답하면 좋다.

예시 2

null이 뜬다

이름을 추가한다

두번째(requesttest.jsp) 파일을 연다

프론트엔드에서 실행하지 않고 백엔드에서 바로 실행했기때문에 null값이 뜬다.

주소copy

붙여넣기 하고 get 방식으로 변경

검사>네트워크에서 어떻게 작성되었는지 알 수있다.

post방식은 보안이 가능하다. 비밀번호가 안보이기 때문에 null 로 뜬다.

name은 backend로 넘길때 파라미터값.

id는 자바스크립트에서 처리하는 값

728x90
반응형

'☭DEVELOPER > #2 웹개발(자바기반 풀스택)' 카테고리의 다른 글

[JQUERY] 플러그인  (0) 2023.08.02
[JAVASCRIPT]DOM  (0) 2023.08.02
[백엔드]OS 단축키 및 네트워크 IP  (0) 2023.08.01
비주얼 스튜디오 코드 외전  (0) 2023.07.31
[JAVA]변수와 주석  (0) 2023.07.24