본문 바로가기

JSP

[211116] JSP JS DB(라이브러리) 연결, MVC

실습 혼자

 

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>방명록 페이지</title>
<script type="text/javascript" src="/static/js/guest.js"></script>
<link type="text/css" rel="stylesheet" href="/static/css/guest.css">
</head>
<body>
<h2>방명록 작성하기</h2>
<form id="guest_form" action="./result.jsp" method="get"><!-- 횟수를 result.jsp로 보냄 -->
<div>
<label>작성자명</label>
<input type="text" name="writer" placeholder="작성자" required>
</div>
<div>
<label>내용</label>
<textarea name="content" placeholder="방명록 작성" required></textarea> 
</div>
<input type="hidden" name="date"><!-- 날짜용 -->
<button type="submit">전송</button>
</form>
</body>
</html>
@charset "UTF-8";

form {
width: 560px;
height: 480px;
background-color: lightsteelblue
}
input {

}
<meta charset="UTF-8">
<title>날짜 및 전송 페이지</title>
</head>
<body>
<%!
GregorianCalendar gd = new GregorianCalendar();
SimpleDateFormat df = new SimpleDateFormat("yyyy년 MM월 dd일 hh:mm");
String strDate = df.format(gd.getTime()); //yyyy년 MM월 dd일 hh시 mm분 ss초

%>

<% 
String strWriter = request.getParameter("writer");
String strContent = request.getParameter("content");
%>
<h3>작성자</h3>
<%= strWriter %>
<br>
<h3>내용</h3>
<%= strContent %>
<h3>작성일</h3>
<%= strDate %>

</body>
</html>

결과

 


실습 풀이

 

db 연동 [16:50~17:10]

 

project 3 - OracleConnect.java 복사해서 src/main/java 폴더 안에 패키지 만들어서(com.db.com - 클래스경로와 일치하게 만들어 준 것) 붙여넣기

 

src/main/java 폴더 : 이클립스에서 자바소스코드만 별도로 관리하기 위해 만들어진 폴더이기 때문에 src > main > java 순으로 직접가서 봐도 똑같다.  

붙여넣기

 

 

project3 할 때 라이브러리 넣어준 것처럼, 톰캣도 라이브러리 읽을 수 있게 jar 폴더 안 파일들 복사해서 lib 폴더에 넣어준다. (저장해 둔 라이브러리 위치 : \eclipse\jar)

 

project3 라이브러리

 

라이브러리 넣기

 

result.jsp 에 import 하고 쓰기!

<%@ page import ="com.db.conn.OracleConnect" %>

 


[19:10~]

USER1 계정으로 테이블 생성해두기 (방명록 데이터 저장용)

 

CREATE TABLE GUESTBOOK (
    ID NUMBER
  , WRITER VARCHAR2(30)
  , CONTENT VARCHAR2(1000)
  , G_DATE DATE
);
ALTER TABLE GUESTBOOK ADD CONSTRAINT ID_PK PRIMARY KEY(ID);

CREATE SEQUENCE GUESTBOOK_SEQ NOCACHE/*실행을 해야 생성이 됨, 잊지 말기*/

 

USER1 계정으로 생성하는 이유 ㄱ

oracle_connection.prop


project6의 OracleConnect 수정 

package com.db.conn;

import java.io.*;
import java.sql.*;
import java.util.*;
import oracle.jdbc.pool.OracleDataSource;

public class OracleConnect {
private Properties info = new Properties();  
private Connection conn = null;
private Statement stat = null;
private String query;


//초기화 블럭으로 prop 파일 부르기 (주석 처리한 user 정보)
{ 
// 1. 데이터베이스 연결 구성 정보가 있는 파일 불러오기
String userHome = System.getProperty("user.home");
//사용자 홈 디렉토리를 문자열로 반환한 것. C:\Users\lmry 
this.info.load(new FileReader(userHome + "/oracle_connection.prop"));
}//초기화 블럭의 예외처리 던지고 싶다면 생성자에서 예외 던지면 된다. //특문 \\oracle_도 가능. 단 2개쓰기 
/*
 * Properties 객체를 활용하여 파일을 FileInputStream으로 읽고
 * load 매소드를 활용하여 해당 파일을 읽어들입니다.
 * properties 파일이 load 가 되면 getProperty 메소드를 통해서 해당 key의 value에 접근 할 수 있습니다. 
 * ex) this.info.getProperty("cloud-url");
 */


/*
 * Oracle Database 연결을 위한 과정
 * 1. 데이터베이스 연결 구성 정보 생성
 * 2. 연결 구성 정보로 데이터베이스 연결
 * 3. 생성된 연결정보로 Statement 생성
 * 4. 생성된 Statement로 Query 전송
 * 5. ResultSet 받아서 필요한 내부 처리 진행
 * 6. 모든 내부 처리 완료 후 자원 반납.(close 작업)
 */
public OracleConnect() throws Exception {
this.connect();  //생성자에서 예외 던지면 초기화블럭 예외처리 던져진다
}

public OracleConnect(boolean wallet) throws Exception {
if(wallet) {
this.walletConnect();
} else {
this.connect();
}
}
// wallet 정보로 데이터베이스 연결
public void walletConnect() throws Exception {
OracleDataSource ods = new OracleDataSource();
ods.setURL(this.info.getProperty("cloud-url"));
ods.setConnectionProperties(this.info);
this.conn = ods.getConnection();
this.stat = this.conn.createStatement();
}

// 기본 정보로 데이터베이스 연결
public void connect() throws Exception {
Class.forName("oracle.jdbc.driver.OracleDriver"); //생략 가능
this.conn = DriverManager.getConnection(
this.info.getProperty("local-url"),
this.info.getProperty("user"),
this.info.getProperty("password")
);
this.stat = this.conn.createStatement();
}

// 실행한 SQL Query를 외부에서 설정하게 한다.
public void setQuery(String query) {
this.query = query;
}

// 설정된 SQL Query를 실행후 결과를 반환한다.
public ResultSet execute() {
ResultSet rs = null;
//만일 null이면 바로 반환 (null처리)
if(this.query == null) {
return rs;
}

try { //executeQuery : SELECT만 가능 (String 반환)
rs = this.stat.executeQuery(this.query);
} catch (SQLException e) {
e.printStackTrace();
}

return rs;
}

public int insertQuery() {
int rs = 0; // 반환되는 rs는 추가또는 수정또는 삭제된 수량을 뜻함 (몇개인지 파악하고 있어야 오류 없는지 판단 가능)
try {   //executeUpdate : INSERT UPDATE DELETE (int 반환) 
rs = this.stat.executeUpdate(this.query);  
} catch (SQLException e) {
e.printStackTrace();
}
return rs;
}

public void close() throws SQLException {
// 6. 모든 내부 처리 완료 후 자원 반납.(close 작업)
this.stat.close(); // this.stat2.close();
this.conn.close(); // this.conn2.close();
} // 예외 던지면 Sample1 클래스의 close(); 실행하는 곳에서 처리 해주면 된다.


}

 

 

result.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ page import ="java.sql.*" %>
<%@ page import ="com.db.conn.OracleConnect" %>

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>결과 화면</title>
</head>
<body>
<% 
String writer = request.getParameter("writer");
String context = request.getParameter("content");
String date = request.getParameter("date");

if(writer.length() <= 4 || writer.length() > 20) {
out.print("작성자는 5자 이상 20자 이하 입니다.");
} else {
/*
System.out.println(writer); //이클립스콘솔에 정상추출됐는지 확인용
System.out.println(content);
System.out.println(date);
*/
//비즈니스 로직
//문자열 형식 날짜를 데이터베이스 날짜 타입으로 변환
Date sqlDate = Date.valueOf(date);
System.out.println(sqlDate); //확인용
//데이터베이스에 저장
OracleConnect oc = new OracleConnect(true);//월렛 사용

//방명록 등록 [1116 20:23] 따옴표
String query = "INSERT INTO GUESTBOOK VALUES(GUESTBOOK_SEQ.NEXTVAL, "
+ "'" + writer + "', '" + context + "', TO_DATE('" + sqlDate + "', 'YYYY-MM-DD'))";
oc.setQuery(query);
int res = oc.insertQuery(); //임포트 필요하면 해야함
if(res == 1) {
out.print("저장완료!");
} else {
out.print("저장에 문제가 발생하였습니다.");
}
oc.close();
}
%>
</body>
</html>

 

guest.jsp

window.onload = function() {
	var guest_form = document.getElementById("guest_form");
	guest_form.addEventListener("submit", guestSubmit);
}

function guestSubmit() {
	var now = new Date();
	var year = now.getFullYear();
	var month = now.getMonth() + 1;
	var date = now.getDate();
	
	this.date.value = year + "-" + month + "-" + date;
	// name이 date인 객체의 value 값(형식포함) 지정
}

MVC Model Pattern

 

Model : 데이터베이스와의 연결 및 비즈니스 로직을 담당하는 객체

          (java 파일)

 

           DTO/VO : Data Transfer Object / Value Object

                         객체간 데이터를 전달하기 위해 사용하는 객체

           DAO : Data Access Object

                    데이터베이스에 접근하여 CRUD 를 처리하기 위한 객체

           Service : 비즈니스 로직을 통해 서비스를 제공하기 위한 객체

 

View : 사용자에게 보여줄 데이터 정보를 담을 화면 구성을 만들어 제공하는 객체

          (jsp 파일)

Controller : 사용자 요청에 적절한 모델과 뷰를 사용하여 응답 정보를 제공하는 객체

          (servlet 파일 - java)