본문 바로가기
대한상공회의소 스마트팩토리 교육/웹 어플리케이션 개발

[웹 어플리케이션 개발] 프로그래밍 환경 구성 «수업-2» : 아파치(Apache), 톰캣(Tomcat) 설치 및 구성 절차 / 서블릿(Servlet) 환경 구성

by 나는영하 2022. 5. 26.

※ 주의사항 

본 블로그는 수업 내용을 바탕으로 제가 이해한 부분을 정리한 블로그입니다.
본 내용을 참고로만 보시고, 틀린 부분이 있다면 지적 부탁드립니다!

감사합니다😁

 


아파치(Apache) 설치 및 설정

톰캣(Tomcat) 설치 및 설정

서블릿(Servlet) 환경 구성


안녕하세요!!

오늘은 웹 어플리케이션 개발을 위한 환경을 조성하기위해

아파치, 톰캣, 서블릿을 설치하고 환경을 구성해보도록 하겠습니다.

 

이번 글은 설치 방법과 절차에 대한 글이기 때문에 각각에 대한 자세한 설명은 다른 더 좋은 인터넷 정보를 활용 바랍니다 ^^: 

 

✔ 아파치(Apache) : 정적인 데이터를 처리하는 웹서버( 정적인 HTML이나 이미지를 제공하는 서버)

✔ 톰캣(Tomcat) : 동적인 데이터를 처리하는 웹서버(WAS 라고도 불린다.) 아파치와 연동해서도 사용하고, 독립적으로도 사용 된다. 

✔ 서블릿(Servlet) : 클라이언트의 요청을 처리하고, 그 결과를 반환하는 Servlet 클래스의 구현 규칙을 지킨 자바 웹 프로그래밍 기술 

 

솔직히 웹에 대한 기본적인 개념이나 구성에 대해선 아직 잘 모르겠습니다.

일단 설치와 프로그래밍 과정부터 공부해보고 웹에 대한 개념은 장기적인 관점에서 천천히 짚어 나가겠습니다. 😥

 

 

1. 아파치(Apache) 설치 및 설정

1-1. 아파치 파일 다운로드 및 설치

✔ 아래의 경로에서 아파치 설치

설치 된 컴퓨터 운영체제의 비트를 확인해서 다운을 받습니다.

https://www.apachelounge.com/download/

 

Apache VS16 binaries and modules download

 

www.apachelounge.com

 

저는 64비트의 OS를 사용하기 때문에 "Apache 2.4.53"의 Win64를 다운받았습니다.

 

✔ 다운받은 파일은 C드라이브 바로 밑에 압축 해제

C드라이브 밑에 압축파일 해제

 


1-2. 아파치 환경 설정 (httpd.conf 파일 수정)

✔ 아래의 경로에 있는 httpd.conf 파일을 메모장으로 실행

 - 경로 : C:\Apache24\conf

httpd.conf 파일을 메모장으로 실행한 첫 화면

이제부터 해당 파일의 일부를 수정하도록 하겠습니다.

오탈자가 없도록 잘 따라오시면 됩니다 :) ~ 

 

✔ 서버 루트 변경 : Define SRVROOT "[아파치 설치 폴더 경로]"

해당 부분은 제가 별도로 수정하진 않았지만 아파치가 설치된 경로가 맞는지 확인해주시면 됩니다. 

 

✔ 서버 포트 관련 부분

서버의 포트와 관련된 부분으로 별도로 수정할 부분은 없습니다. 포트 번호가 80인것만 알고 넘어갑시다 !

 

✔ 도메인 주소 관련 부분 : 서버 네임 수정

(좌) 변경 전 / (우) 변경 후

도메인 주소와 이름 관련 부분입니다.

ServerName을 "127.0.0.1"로 수정해줍니다. 반드시 주석 표시인 "샵(#)"을 지워줍시다!!

 

✔ DocumentRoot 수정 

(좌) 변경 전 / (우) 변경 후

C드라이브 밑에 "webroot"라는 폴더를 새로 만들고 위와 같이 해당 경로로 수정해줍니다. 

html 파일이 들어갈 폴더에 해당합니다. 경로를 표시할 때는 역슬래시가 아니라 슬래시로 표시해야함을 기억합시다.(리눅스나 아파치 등은 슬래시를 사용한다고 합니다 ^^)

 

✔ 한글 인코딩

httpd.conf 파일의 마지막에 한글 인코딩을 위한 문구를 추가해줍니다.

 " # ~ "은 주석문에 해당하니 무시하셔도 됩니다!!


1-3. 아파치 실행

아래의 과정은 윈도우 환경에서 서비스를 등록하는 과정으로 한번만 수행하면 됩니다!

(리눅스 과정에선 할 필요가 없다고 합니다!)

 

✔ 명령프롬프트(관리자 권한)를 실행하고 아래와 같이 타이핑 합니다. 

(설치 한부분은 캡처를 하지 못해서 이미 서비스가 설치되어있다는 문구만 출력이 됩니다. )

- 서비스 시작 : httpd -k restart

- 서비스 종료 : httpd -k stop

 

서비스에서 Apache2.4가 있는지 확인

Apache2.4가 있으면 정상적으로 설치된것입니다.

단, 자동을 수동으로만 변경해주겠습니다. (굳이 안해도 되지만 쾌적한 PC 환경을 위해 ^^)

 


1-4. 확인

✔ html 파일 만들기

정상적으로 동작하는지 확인하기 위해 기존에 만들어 두었던 C드라이브 밑에 webroot에 아래와 같이 html 파일을 만들어보도록 하겠습니다. 

 

✔ 주소창에 "127.0.0.1"을 입력해서 정상적으로 나오는지 확인!

정상적으로 아파치를 통해 프로그래밍이 되는지 확인하였습니다!

나머지는 html 등 프로그래밍 공부를 해서 html 파일을 채워넣으면 될 것 같네요..


2. 톰캣(Tomcat) 설치 및 설정

2-1. 톰캣 파일 다운로드 및 설치

✔ 아래의 경로에서 톰캣 설치

https://tomcat.apache.org/

 

Apache Tomcat® - Welcome!

The Apache Tomcat® software is an open source implementation of the Jakarta Servlet, Jakarta Server Pages, Jakarta Expression Language, Jakarta WebSocket, Jakarta Annotations and Jakarta Authentication specifications. These specifications are part of the

tomcat.apache.org

안정성을 위해 최신 버전이 아닌 9.0.63버전을 설치하였습니다.

64-bit Windows zip 파일을 다운받았습니다.

 

✔ 다운받은 파일은 C드라이브 바로 밑에 압축 해제


2-2.  톰캣 환경 설정 (Server.xml 파일 수정)

✔ 아래 경로의 Server.xml 파일을 메모장으로 실행하여 줍니다. 

경로 : C:\apache-tomcat-9.0.63\conf

Server.xml을 메모장으로 실행한 화면

이제부터 해당 파일의 일부를 수정하도록 하겠습니다.

오탈자가 없도록 잘 따라오시면 됩니다 :) ~ 

 

✔ 아파치와 톰캣을 서로 연동하기 위한 설정

(좌) 변경 전 / (우) 변경 후

 - 꼭 앞뒤의 주석을 풀어줍니다.( <!-- / --> )

 - 직접 타이핑하지 않고 다른곳에서 복사 붙여넣기 할 경우 큰따옴표는 다시 입력해주어야 합니다.

(쌍따옴표의 아스키코드값이 서로 달라서 톰캣을 통해 웹 프로그래밍을 하면 오류가 발생한다고 하네요..)

 

※ 정적 데이터는 웹서버인 아파치가 처리하고 동적 데이터는 와스인 톰캣이 처리함으로써 서버의 전체적인 부하를 분산하고 속도를 빠르게 하기 위해 연동을 사용한다고 합니다!!   

 

 

✔ 호스트 네임 및 경로 수정 

(좌) 변경 전 / (우) 변경 후

호스트 경로를 수정해 줍니다. 여기서는 html의 파일이 들어있는 "webroot" 폴더의 경로를 지정하였습니다.

 

✔ Context 경로 추가 

큰따옴표와 슬래시를 주의해서 위와 같은 코드를 그대로 타이핑해줍니다. 


2-3.  환경 변수 추가 및 CLASSPATH 수정

✔ CATALINA_HOME, CATALINA_BASE 생성 후 톰캣 설치 경로 입력

 

✔ CATALINA_TMPDIR 생성 후 temp 폴더 경로 입력

 

✔ CLASSPATH 수정

새로만들기 선택 후 < %CATALINA_HOME%\lib; > 입력!

(세미콜론 까지 확실하게!!!)

 

✔ JRE_HOME 생성 후 자바 설치 경로 입력

 

✔ 환경변수가 잘 저장되었는지 확인


2-4.  톰캣 시작 / 중지

✔ [Tomcat_Home] / bin / startup.bat 파일 실행

(좌) 명령 프롬프트 / (중) 톰 캣 실행창 / (우) 액세스 허용 창

bin 폴더에 있는 startup 파일을 실행해주면 위와 같이 두개의 창이 추가로 뜨게됩니다.

첫번째는 한글이 깨져서 알수없는 외계어가 나오는 Tomcat 창인데 이는 정상적으로 수행되는 과정이니 일단 넘어가겠습니다. (아래에서 한글이 정상적으로 나오는 방법을 설명드립니다!!)

두번째는 보안경고창인데 그냥 액세스 허용을 눌러주시면 됩니다! 

 

[Tomcat_Home] / bin / shutdown 파일 실행

shutdown을 실행해주면 톰 캣창이 닫히면서 정상적으로 중지가 됩니다.

 

✔ Tomcat 콘솔 한글 깨짐 문제 해결 

 - 윈도우 검색에서 레지스트리 편집기 실행

 - HKEY_CURRENT_USER / Console 디렉토리에서 오른쪽 마우스 버튼 클릭 → 새로 만들기 → 키 → Tomcat 생성 → Tomcat 폴더 안에 새로 만들기 → DWORD(32비트) → 이름 CodePage, 데이터 65001, 단위 10진수 선택 

레지스트리 편집기와 DWORD 값 편집 창

위와 같은 과정을 거치면 아까는 한글이 깨져서 외계어처럼 보였던 톰캣 콘솔차이 정상적으로 보여집니다.


2-5.  톰캣 확인

✔ 톰캣 콘솔 창을 열어놓은 상태(Startup.bat 파일 실행)에서 주소창에 "127.0.0.1:8080"을 입력합니다.

 

연동포트는 8009였지만 톰 캣 포트는 8080인거 같습니다. (포트에 대한 내용은 나중에 다시 확인해보겠습니다.)

아파치는 디폴트값 포트를 사용하기 때문에 별도로 포트를 입력하지 않아도 됩니다!

한글이 깨져서 나오는 현상 발생

 

✔ html 안에 charset 관련 코드 한줄 추가

html에 <meta charset = "utf-8"> 이란 코드를 한줄 추가해주면 한글이 깨지지 않고 정상적으로 표시 됩니다!


3. 서블릿(Servlet) 환경 구성

3-1. 서블릿 디렉토리 생성

[프로젝트 디렉토리(본인은 c:/webroot)] 하단에 WEB-INF 폴더 생성

✔ WEB-INF 디렉토리 하단에 classes, lib, scr 폴더 생성

✔ [TOMCAT_HOME]/webapps/ROOT/WEB-INF/web.xml 파일을 [프로젝트 디렉토리]/WEB-INF 폴더 내로 복사

경로를 참고해서 똑같이 폴더를 생성해주세요!

톰캣 5.0 버전부터는 어플리케이션별로 디렉토리를 할당하는 다계층 구조로 구성이 가능하고 WAR로의 배포가 가능하도록 META-INF 구조 지원


3-2. 클래스 생성 및 등록

✔ src 폴더에 서블릿 소스파일을 생성

 

✔ Annotation 이용하기 위해 web.xml 파일 수정

WEB-INF 폴더 내 web.xml 파일을 이용해서 서블릿 클래스를 등록하지 않고 자바 소스에 직접 URI를 기술하는 방식으로 web.xml 파일 내 web-app 옵션 중 metadata-complete를 반드시 false로 변경

 

✔ 컴파일시 에러발생 → 환경 변수 중 패스 수정

HelloTest.java 파일을 컴파일하면 아래와 같은 오류 발생

환경 변수 창에서 CLASSPATH의 경로를 변경해줍니다. 

 

환경 변수를 수정하였으면 다시 명령프롬프트를 껐다가 킨 후 다시 컴파일 하면 정상 동작되는걸 확인 할 수 있습니다.

(반드시 껐다가 켜야지만 정상 동작 합니다!!!)

(좌) 웹 접속 화면 / (우) classes 폴더 내 컴파일 파일 확인

classes 폴더 안에 정상적으로 컴파일된 파일이 저장되어 있습니다.

(명령프롬프트에서 javac 명령어를 통해 컴파일할때 classes 폴더를 경로로 저장했었습니다!!)

 

※ 주의사항

1) 반드시 웹으로 접속하기 위해서는 톰 캣의 콘솔창이 켜져있어야 합니다.

2) 127.0.0.1:8080/hellojava 의 경로로 들어가셔야 합니다.

위의 java 파일 내에 @WebServlet의 괄호안에 있는 글자가 도메인 주소에서 포트 번호 뒤의 주소에 해당합니다.

 


3-3. MariaDB와 연결 

✔ MariaDB Connector/J (JDBC) 다운로드

✔ mariadb-java-client-[X.X.X].jar 파일을 아래의 경로에 복사

경로 : C:\webroot\WEB-INF\lib

 

✔ DB연동을 위한 아래와 같은 코드 입력 및 파일 생성

src 폴더에 클래스명과 동일한 파일 생성

import java.io.IOException;
import java.io.PrintWriter;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.ResultSet;
import java.sql.Statement;

import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

@WebServlet("/machineinfo")
public class JDBCConnection extends HttpServlet{

	private static final long serialVersionUID = 1L;
	
    public void doGet(HttpServletRequest req, HttpServletResponse resp)  throws IOException {
    	
	resp.setContentType("text/html; charset=UTF-8");
	PrintWriter out = resp.getWriter();
	String uri ="jdbc:mariadb://192.168.56.101:3306/machine";
	String userid = "smartUSER";
	String userpw = "1234";
	String query = "select machineName, managerName, temperature,power,runTime from tbl_machine";
	Connection con = null;
	Statement stmt = null; 
	ResultSet rs = null;
            	
	try{
		Class.forName("org.mariadb.jdbc.Driver");
		con = DriverManager.getConnection(uri,userid,userpw);
		stmt = con.createStatement();
		rs = stmt.executeQuery(query);
	
		out.println("<!DOCTYPE HTML><HEAD><TITLE>JDBC Test</TITLE></HEAD>");
       		out.println("<BODY>");
		out.print("<h1>서블릿 DB 연동 테스트</h1>");
		out.println("<TABLE border=1><TR><TD>기계명</TD><TD>관리자</TD><TD>온도</TD><TD>전력사용량</TD><TD>운전시간</TD></TR>");
	
		while(rs.next()) {
			out.println("<TR><TD>" + rs.getString("machineName") + "</TD>"
			+ "<TD>" + rs.getString("managerName") +"</TD>"
			+ "<TD>" + rs.getInt("temperature") + "</TD>"
			+ "<TD>" + rs.getInt("power") + "</TD>"
			+ "<TD>" + rs.getInt("runTime") + "</TD>");
		}
		out.println("</TABLE></BODY>");

		if(rs != null) { rs.close(); }
		if(stmt != null) { stmt.close(); }
		if(con != null) { con.close(); }
	}catch(Exception e) { e.printStackTrace(); }

} //End of doGet

파일 이름은 클래스 이름과 동일하게 JDBCConnection.java 

 

※ DB와 연동하는 부분은 이유를 모르겠지만 HTTP 404 오류가 발생하는 상황입니다. 

IDE를 사용하지 않고 위의 과정 처럼 웹을 프로그래밍 하는 방법은 아주 원시적이고 요즘에는 사용하지 않는 방법이라고 합니다. 웹 프로그래밍에 대한 대략적인 개념을 짚어주기 위한 과정이였으니 DB연동은 IDE를 통해 진행해보도록 하겠습니다.

댓글