본문 바로가기

MVC1/로그인, 회원가입

// Me// login, 회원가입

 

 

 

index.jsp

<%
	response.sendRedirect("login.jsp");
%>

 

 

 

login.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Login하기</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="http://lab.alexcican.com/set_cookies/cookie.js" type="text/javascript" ></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
<style>
	body {
		color: #fff;
		/* background: black; */
		background-image: url('./image/images (1).jpg');
	}
	.form-control {
		min-height: 41px;
		background: #f2f2f2;
		box-shadow: none !important;
		border: transparent;
	}
	.form-control:focus {
		background: #e2e2e2;
	}
	.form-control, .btn {        
        border-radius: 2px;
    }
	.login-form {
		width: 500px;
		margin: 30px auto;
		text-align: center;
		border-radius: 100px;
		opacity: 0.95;
	}
	.login-form h2 {
        margin: 10px 0 25px;
    }
    .login-form form {
		color: #7a7a7a;
		border-radius: 3px;
    	margin-bottom: 15px;
        background: #fff;
        box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
        padding: 30px;
    }
    .login-form .btn {        
        font-size: 16px;
        font-weight: bold;
		background: black;
		border: none;
        outline: none !important;
    }
	.login-form .btn:hover, .login-form .btn:focus {
		background: #2389cd;
	}
	.login-form a {
		color: #fff;
		text-decoration: underline;
	}
	.login-form a:hover {
		text-decoration: none;
	}
	.login-form form a {
		color: #7a7a7a;
		text-decoration: none;
	}
	.login-form form a:hover {
		text-decoration: underline;
	}
</style>
</head>
<body>
<div class="login-form">
    <form id="frm" method="post">
        <h2 class="text-center">로그인</h2>   
        <div class="form-group has-error">
        	<input type="text" class="form-control" id="id" name="id" placeholder="유저 아이디" required="required">
        </div>
		<div class="form-group">
            <input type="password" class="form-control" id="pwd" name="pwd" placeholder="비밀번호" required="required">
        </div>        
        <div class="form-group">
            <button type="button" id="_btnLogin" class="btn btn-primary btn-lg btn-block" value="로그인">로그인 하기</button>
        </div>
        <input type="checkbox" name="check" id="chk_save_id">아이디 기억하기
        <p><a href="searchpwd">비밀번호 찾기</a></p>
    </form>
    <p class="text-center small">계정 만들기 <a href="regi.jsp">클릭!</a></p>
</div>
<script type="text/javascript">
$("#_btnLogin").click(function() {
	//alert("click");
	if ($("#id").val().trim() == "") {
		alert("id를 입력해 주십시오");
		$("#id").focus();
	}else if ($("#pwd").val().trim() == "") {
		alert("password를 입력해 주십시오");
		$("#pwd").focus();
	}else {
		$("#frm").attr("action", "loginAf.jsp").submit();
	}
});


//cookie : String	-> id
//session : Object	-> login 개인정보
let user_id = $.cookie("user_id");
if (user_id != null) {//아이디가 있을 때
	//alert("cookie 있음");
	$("#id").val(user_id);
	$("#chk_save_id").attr("checked", "checked");
}
$("#chk_save_id").click(function() {
	if ($("#chk_save_id").is(":checked")) {//체크 되었을때
		//alert('체크됨');
		//cookie ID저장(페이지 껏다가 켜도 아이디 저장되어있음)
		if ($("#id").val().trim() == "") {//id가 빈 상태로 check를 누르면 에러알림창이 뜸
			alert("id를 입력해 주십시오");
			$("#chk_save_id").prop("checked", false);
		}else {
			$.cookie("user_id", $("#id").val().trim(), {expires:7, path:'/'})//기한 7일
		}
	}else {
		//alert('체크 없어짐');
		//cookie 삭제
		$.removeCookie("user_id", {path:'/'});
	}
});
</script>
</body>
</html>

 

 

 

loginAf.jsp

<%@page import="dto.MemberDto"%>
<%@page import="dao.MemberDao"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
	String id = request.getParameter("id");
	String pwd = request.getParameter("pwd");
	
	//System.out.println("id: " + id + ", pwd: " + pwd);

%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>loginAf.jsp</title>
</head>
<body>
<%
MemberDao dao = MemberDao.getInstance();
MemberDto mem = dao.login(id, pwd);

if(mem != null && !mem.getId().equals("")){
	//login정보 저장
	session.setAttribute("login", mem);
	session.setMaxInactiveInterval(30 * 60 * 60);
	%>
	
	<!-- login 성공 -->
	<script type="text/javascript">
	alert("안녕하세요 <%=mem.getName() %>님");
	location.href = "./bbslist.jsp";
	</script>
	<%
}else{
	%>
	<!-- login 실패 -->
	<script type="text/javascript">
	alert("id나 password를 확인해주세요");
	location.href = "./login.jsp";
	</script>
	<%
}
%>
</body>
</html>

 

 

 

 

 

regi.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Login하기</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="http://lab.alexcican.com/set_cookies/cookie.js" type="text/javascript" ></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
<style>
	body {
		color: #fff;
		/* background: black; */
		background-image: url('./image/images (1).jpg');
	}
	.form-control {
		min-height: 55px;
		background: #f2f2f2;
		box-shadow: none !important;
		border: transparent;
		
		
	}
	.form-control:focus {
		background: #e2e2e2;
	}
	.form-control, .btn {        
        border-radius: 15px;
    }
	.regi-form {
		width: 500px;
		margin: 30px auto;
		text-align: right;
		opacity: 0.95;
		
	}
	.regi-form h2 {
        margin: 10px 0 25px;
    }
    .regi-form form {
		color: #7a7a7a;
		border-radius: 20px;
    	margin-bottom: 15px;
        background: #fff;
        box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
        padding: 40px;
    }
    .regi-form .btn {        
        font-size: 16px;
        font-weight: bold;
		background: black;
		border: none;
        outline: none !important;
    }
	.regi-form .btn:hover, .regi-form .btn:focus {
		background: #2389cd;
	}
	.regi-form a {
		color: #fff;
		text-decoration: underline;
	}
	.regi-form a:hover {
		text-decoration: none;
	}
	.regi-form form a {
		color: #7a7a7a;
		text-decoration: none;
	}
	.regi-form form a:hover {
		text-decoration: underline;
	}
</style>
</head>
<body>
<div class="regi-form">
    <form id="frm" method="post">
        <h2 class="text-center">회원 가입</h2>   
        <div class="form-group has-error">
        	<input type="text" class="form-control" id="id" name="id" placeholder="id" required="required">
        	
        	<!-- 중복확인버튼 -->
        	 <input type="button" class="btn1" id="idBtn" name="idBtn" value="ID 중복확인" style="	border-radius: 10px;
        	 	border: none; outline: none !important; font-weight: bold; background-color: gray; color: white" >
        	<p id="p"><b>중복확인 버튼을 눌러주세요</b></p>
        	
        </div>
               
		<div class="form-group">
            <input type="password" class="form-control" id="pwd" name="pwd" placeholder="Password" required="required">
        </div>
		<div class="form-group">
            <input type="text" class="form-control" id="name" name="name" placeholder="Name" required="required">
        </div> 
		<div class="form-group">
            <input type="text" class="form-control" id="email" name="email" placeholder="Email address" required="required">
        </div> 
        <div class="form-group">
            <button  id="_btnRegi" class="btn btn-primary btn-lg btn-block" value="회원가입">회원가입 하기</button>
        </div>
    </form>
    <p class="text-center small">로그인 화면으로 돌아가기 <a href="index.jsp">클릭!</a></p>
</div>
<script type="text/javascript">
$(document).ready(function() {
	//빈칸 검사
	$("#_btnRegi").click(function() {
		if ($("#id").val().trim() == "") {
			alert("id를 입력해 주십시오");
			$("#id").focus();
		}else if ($("#pwd").val().trim() == "") {
			alert("password를 입력해 주십시오");
			$("#pwd").focus();
		}else if ($("#name").val().trim() == "") {
			alert("이름을 입력해 주십시오");
			$("#name").focus();
		}else if ($("#email").val().trim() == "") {
			alert("email 주소를 입력해 주십시오");
			$("#email").focus();
		}else {
			//$("#frm").submit();
			$("#frm").attr("action", "regiAf.jsp").submit();

		}
	});
	
	//id중복 확인
	$("#btn").click(function () {
		
			$.ajax({
				type:"post",
				url:"./idcheck.jsp",
			//	data:"id=" + $("#id").val(),
				data:{ "id":$("#id").val() },
				success:function( data ){
				//	alert("success");
				//	alert(data.trim());
					if(data.trim() == "YES"){
						$("#idcheck").css("color", "#0000ff");
						$("#idcheck").html('사용할 수 있는 id입니다');
					}else{
						$("#idcheck").css("color", "#ff0000");
						$("#idcheck").html('사용 중인 id입니다');
						$("#id").val("");
					}			
				},
				error:function(){
					alert("error");
				}
			});
		});
});

</script>
</body>
</html>

 

 

 

 

 

regiAf.jsp

<%@page import="dto.MemberDto"%>
<%@page import="dao.MemberDao"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
request.setCharacterEncoding("utf-8");

String id = request.getParameter("id");
String pwd = request.getParameter("pwd");
String name = request.getParameter("name");
String email = request.getParameter("email");

System.out.println(id + pwd + name + email);
%>

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<%
MemberDao dao = MemberDao.getInstance();
boolean result = dao.addMember(new MemberDto(id,pwd,name,email,0));

if(result){
%>
	<script type="text/javascript">
	alert('성공적으로 추가되었습니다');
	location.href = "login.jsp";
	</script>
<%
}else{
%>
	<script type="text/javascript">
	alert('추가되지 않았습니다');
	location.href = "regi.jsp";
	</script>
<%
}
%>
</body>
</html>

 

 

 

 

chechkId.jsp

<%@page import="dao.MemberDao"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
	String id = request.getParameter("id");
	
	MemberDao dao = MemberDao.getInstance();
	boolean b = dao.getId(id);
	
	if(b == true){
		out.print("No");
	}else{
		out.print("Yes");
	}
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
</body>
</html>

 

 

 

 

 

 

MemberDao.java

package dao;
public class MemberDao {
	private static MemberDao dao = new MemberDao();
	
	private MemberDao() {
		// TODO Auto-generated constructor stub\
		DBConnection.initConnection();
	}
	public static MemberDao getInstance() {
		return dao;
	}
	
	//id 중복확인
	public boolean getId(String id) {
		//id 확인 -> true/ false
		//return true;
		String sql = " SELECT ID"
				+ " FROM MEMBER "
				+ " WHERE ID=? ";
		
		Connection conn = null;
		PreparedStatement psmt = null;
		ResultSet rs = null;
		
		int count = 0;
		
			try {
				conn = DBConnection.getConnection();
				psmt = conn.prepareStatement(sql);
				psmt.setString(1, id.trim());
				
				count = psmt.executeUpdate();
			} catch (Exception e) {
				// TODO Auto-generated catch block
				e.printStackTrace();
		
		} finally {
			DBClose.close(psmt, conn, null);	
		}
		
		return count>0?true:false;
	}
	
	//신규회원 추가
	public boolean addMember(MemberDto dto) {
		//회원가입의 데이터 -> DB
		//return true;
		String sql = " INSERT INTO MEMBER(ID, PWD, NAME, EMAIL, AUTH) "
				+ " VALUES(?, ?, ?, ?, 3) ";

		Connection conn = null;
		PreparedStatement psmt = null;
		int count = 0;
		
		try {
				conn = DBConnection.getConnection();
				psmt = conn.prepareStatement(sql);
				psmt.setString(1, dto.getId());
				psmt.setString(2, dto.getPwd());
				psmt.setString(3, dto.getName());
				psmt.setString(4, dto.getEmail());
				
				count = psmt.executeUpdate();
		} catch (Exception e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		} finally {
			DBClose.close(psmt, conn, null);	
		}
		return count>0?true:false;
	}
	
	public MemberDto login(String id, String pwd) {
		String sql = " SELECT ID, NAME, EMAIL, AUTH "
					+ " FROM MEMBER "
					+ " WHERE ID=? AND PWD=? ";
		
		Connection conn = null;
		PreparedStatement psmt = null;
		ResultSet rs = null;
		
		MemberDto dto = null;
		
		try {
			conn = DBConnection.getConnection();
			System.out.println("1/6 login success");
			
			psmt = conn.prepareStatement(sql);
			psmt.setString(1, id);
			psmt.setString(2, pwd);
			System.out.println("2/6 login success");
			
			rs = psmt.executeQuery();
			
			if (rs.next()) {
				String user_id = rs.getString(1);
				String name = rs.getString(2);
				String email = rs.getString(3);
				int auth = rs.getInt(4);
				
				dto = new MemberDto(user_id,null,name, email, auth);//pwd는 null로 뺌
			}
		} catch (Exception e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		}finally {
			DBClose.close(psmt, conn, rs);
		}
		return dto;
	}
}

 

 

 

dto.java

package dto;

import java.io.Serializable;
/*
DROP TABLE MEMBER
CASCADE CONSTRAINTS;

CREATE TABLE MEMBER(
	ID VARCHAR2(50) PRIMARY KEY,
	PWD VARCHAR2(50) NOT NULL,
	NAME VARCHAR2(50) NOT NULL,
	EMAIL VARCHAR2(50) UNIQUE,
	AUTH NUMBER(1) NOT NULL
);
 */
public class MemberDto implements Serializable {
	private String id;
	private String pwd;
	private String name;
	private String email;
	private int auth;	//사용자(3)/관리자(1)
	
	public MemberDto() {
		// TODO Auto-generated constructor stub
	}
	public MemberDto(String id, String pwd, String name, String email, int auth) {
		super();
		this.id = id;
		this.pwd = pwd;
		this.name = name;
		this.email = email;
		this.auth = auth;
	}
	public String getId() {
		return id;
	}
	public void setId(String id) {
		this.id = id;
	}
	public String getPwd() {
		return pwd;
	}
	public void setPwd(String pwd) {
		this.pwd = pwd;
	}
	public String getName() {
		return name;
	}
	public void setName(String name) {
		this.name = name;
	}
	public String getEmail() {
		return email;
	}
	public void setEmail(String email) {
		this.email = email;
	}
	public int getAuth() {
		return auth;
	}
	public void setAuth(int auth) {
		this.auth = auth;
	}
	@Override
	public String toString() {
		return "MemberDto [id=" + id + ", pwd=" + pwd + ", name=" + name + ", email=" + email + ", auth=" + auth + "]";
	}
}

 

 

 

 

DBClose.java

package db;

import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.sql.Statement;

import javax.naming.spi.DirStateFactory.Result;

public class DBClose {

	public static void close(PreparedStatement psmt, Connection conn, ResultSet rs) {
		
			try {
				if (psmt != null) {
					psmt.close();
				}
				if (conn != null) {
					conn.close();
				}if (rs != null) {		//Select
					rs.close();
				}
				
			} catch (Exception e) {
				// TODO Auto-generated catch block
				e.printStackTrace();
		}
	}

 

 

 

 

DBConnection.java

package db;

import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.SQLException;

public class DBConnection {
	public static void initConnection() {
		try {
			Class.forName("oracle.jdbc.driver.OracleDriver");
			
			System.out.println("Driver Loading Success");
			
			
		} catch (ClassNotFoundException e) {

			e.printStackTrace();
		}
	}
	
	public static Connection getConnection()throws Exception {			
		
		Connection conn = null;		
		
			conn = DriverManager.getConnection("jdbc:oracle:thin:@192.168.7.40:1521:xe",
												"hr", "hr");	
			System.out.println("Oracle Connection Success");
			return conn;
	}
}

 

'MVC1 > 로그인, 회원가입' 카테고리의 다른 글

강사님/ login, 회원가입  (0) 2020.07.28
cookie로 id저장하기  (0) 2020.07.28