국비 59 일차

Notice

Recent Posts

Recent Comments

Link

« 2025/07 »
일	월	화	수	목	금	토
		1	2	3	4	5
6	7	8	9	10	11	12
13	14	15	16	17	18	19
20	21	22	23	24	25	26
27	28	29	30	31

Tags more

Archives

Today

Total

관리 메뉴

기분좋음

국비 59 일차 본문

IT 포트폴리오/국비지원교육 Diary

국비 59 일차

기분좋음:) 2022. 3. 16. 10:39

복습

회원 관리 시스템 만들기

기능 구현위해 만들어야할 파일들

https://5happyman.tistory.com/75

국비 58 일차

데이터 베이스를 연동한 회원관리 시스템 만들기 JSP, Servlet, SQL, JS 모두 사용 JSP파일 설명 경로 login.jsp 로그인 아이디 비밀번호 입력받는 폼 WebContent/member join.jsp 회원 가입위한 정보를 입력받는.

5happyman.tistory.com

기본 세팅

이클립스에서

Dynamic Web Project를 새로 만들어 준다.

project란 이름으로 만들어보자.

Generate web.xml deployment descriptor (체크) -기본 web.xml파일 만들도록 설정

WEB-INF → lib에

JDCP(JAVA Database Connectivity)사용을 위한 ojdbc6.jar 파일 → 데이터베이스에 접속할 수 있게하는 자바API

JSTL(JSP Standard Tag Library) taglibs 파일 3개를 넣어준다. → c:, fmt: 등의 지시자를 사용 가능하게 한다

프로젝트 안에 jsp파일 하나를 만들어 서버를 가동시켜주면

server.xml 파일의 가장 마지막 부분으로 드래그 하면 project의 새로운 Context줄이 생성되어 있다.

Context태그 사이에 tomcat에서 복사해온 커넥션풀 코드를 넣어준다. (DBCP코드)

코드를 자신의 맞게 수정해준다. (path , 아이디, 비번등등)

Java Resources 폴더에 서블릿 파일들을 넣어줄 패키지들을 생성한다.

1. com.project.controller - 기능 구현해줄 서블릿들 패키지

2. com.project.dao - DB에 접근해줄 객체있는 패키지

3. com.project.dto - 회원정보를 한번에 가져올 vo객체(자바 빈)이 있는 패키지

프로그램 코드 작성

1. DB 테이블을 준비

(SQL에 DB테이블 준비)

2. Vo 객체 준비한다.

com.project.dto패키지에

MemberVO.java (자바 빈)

package com.project.dto;

public class MemberVO {
	private String name;
	private String userid;
	private String pwd;
	private String email;
	private String phone;
	private int admin;
	
	public String getName() {
		return name;
	}
	public void setName(String name) {
		this.name = name;
	}
	public String getUserid() {
		return userid;
	}
	public void setUserid(String userid) {
		this.userid = userid;
	}
	public String getPwd() {
		return pwd;
	}
	public void setPwd(String pwd) {
		this.pwd = pwd;
	}
	public String getEmail() {
		return email;
	}
	public void setEmail(String email) {
		this.email = email;
	}
	public String getPhone() {
		return phone;
	}
	public void setPhone(String phone) {
		this.phone = phone;
	}
	public int getAdmin() {
		return admin;
	}
	public void setAdmin(int admin) {
		this.admin = admin;
	}
	
	@Override
	public String toString() {
		return "MemberVO [name="+name+", userid="+userid+", pwd="+pwd+", "
				+ "email="+email+", phone="+phone+", admin="+admin+"]";
	}	

}

db 테이블에 있는 칼럼 수대로 멤버 변수를 만든후 , getter/setter 메서드 생성

네임에 따라 다른 결과값 출력 하도록 toString() 메서드를 오버라이딩 해준다.

3. Dao객체를 싱글톤으로 준비한다.

com.project.dto패키지에

MemberDAO.java (db에 접근할 클래스 생성)

package com.project.dao;

public class MemberDAO {
   
	private MemberDAO() {}
    
	private static MemberDAO instance = new MemberDAO();
	
    public static MemberDAO getInstance() {
		return instance;
	}

클래스 하나에 객체를 하나만 가져올 수 있도록 싱글톤 화 해준다.

getInstance()로 객체 가져올 수있게 준비

4. DAO 객체 DBCP 등록 -> 테스트 코드로 데이터베이스 접속을 테스트 한다. -> test.jsp

MemberDAO.java + 추가

MemberDAO.java에 추가

public Connection getConnection() throws Exception {
		Connection conn = null;
        
        //현재 환경에 context("java:/comp/env")찾아서 생성
		Context initContext = new InitialContext();
		Context envContext = (Context)initContext.lookup("java:/comp/env");
        
        // "jdbc/myoracle"에 해당하는 객체 찾기 
		DataSource ds = (DataSource) envContext.lookup("jdbc/myoracle");
        
        //커넥션 풀에서 객체 얻어오기
		conn = ds.getConnection();
		return conn;
	}

MemberDAO클래스와 db테이블을 DBCP로 연결해준다.

test.jsp

<%@ page import="java.sql.Connection"%>
<%@ page import="com.project.dao.MemberDAO"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
    <%
        MemberDAO memdao = MemberDAO.getInstance();
        Connection conn = memdao.getConnection();
        out.println("DBCP성공");
    %>
</body>
</html>

jsp 파일을 만들어서 MemberDAO 객체를 불러온 후, 커넥션풀의 객체를 불러온다.

5. 로그인 폼 만들기 -login.jsp , member.js

index.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
	<a href="login.do"> 로그인 페이지로 이동 </a>  <!-- .do는 서블릿을 지칭 -->
</body>
</html>

index.jsp 를 만들어 login.do(서블릿 어노테이션) 를 연결해준다.

login.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>LOGIN</title>
<script type="text/javascript" src="../script/member.js"></script>
</head>                          //유효성 검사할 자바스크립트 
<body>
    <h2>로그인</h2>
    <form method="post" action="project/login.do" name="frm">
        <table>                 //로그인 폼 전송시 login.do 서블릿 실행
            <tr>
                <td>아이디</td>
                <td><input type="text" name="userid" value="${userid}"></td>
            </tr>
            <tr>
                <td>암 호</td>
                <td><input type="password" name="pwd"></td>
            </tr>
            <tr>
                <td colspan="2" align="center"><input type="submit" value="전송">
                &nbsp;&nbsp;<input type="reset" value="취소">
                &nbsp;&nbsp;<input type="button" value="회원가입 " onclick="location.href='project/join.do'">
                </td>                                        //회원가입 클릭시 join.do 서블릿 실행
            </tr>
            <tr>
                <td colspan="2">${message}</td>   //서블릿 실행후 나올 메세지
        </table>   
    </form>
</body>
</html>

Web-Content → script폴더 생성 →

member.js

function loginCheck(){
	if (document.frm.userid.value.length == 0) {
		alert("아이디들 입력해주세요.");
		frm.userid.focus();
		return false;
	}
	if (document.frm.pwd.value == "") {
		alert("비밀번호를 입력해주세요.");
		frm.pwd.focus();
		return false;
	}
	return true;
}

로그인 유효성 검사 작성

6. 로그인 폼에 직접 접근하지 못하도록 서블릿을 통한 매핑 만들기

'IT 포트폴리오 > 국비지원교육 Diary' 카테고리의 다른 글

국비 61 일차 (0)	2022.03.18
국비 60 일차 (0)	2022.03.17
국비 58 일차 (0)	2022.03.15
국비 57 일차 (0)	2022.03.14
국비 56 일차 (0)	2022.03.11

'IT 포트폴리오/국비지원교육 Diary' Related Articles

기분좋음

국비 59 일차 본문

국비 59 일차

복습

회원 관리 시스템 만들기

기본 세팅

프로그램 코드 작성

'IT 포트폴리오 > 국비지원교육 Diary' 카테고리의 다른 글

티스토리툴바