본문 바로가기

웹 개발

JSP와 MariaDB 연동하기(6)

728x90

로그인 페이지를 구현해 보았다.

DB에 id와 pw를 넣어놓고 알맞게 입력하면 이전의 empList.jsp를 보여주는 간단한 jsp를 만들었다.

 

20240315 JSP와 MariaDB 연동하기(5)

이번엔 이전의 페이지 왼쪽 부분에 사이드바를 만들었다. 왼쪽 사이드의 DEPTNO를 누르면 해당 부서의 emp만 나오게 되는 것이다. 왼쪽 div의 dept값을 요청한 것을 getParameter로 deptNo 변수에 담는다.

broad-backend.tistory.com

DB는 MariaDB를 사용했으며 아래에 DB가 있다

 

bootstrap을 사용해 로그인 폼을 꾸미고 post방식으로 폼을 만들었다.

loginForm.jsp

<%@ 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>
<!-- Latest compiled and minified CSS -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">

<!-- Latest compiled JavaScript -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script></head>
<body>

	<div class="row">
		<div class="col"></div>
		<div class="col mt-4 p-4 bg-secondary text-white rounded">
			<h1 class="text-dark">loginForm</h1>
		
			<form action="/crudtest/loginAction.jsp" method="post">
				<div class="mt-2">
					id : <input type="text" name="id" class="form-control">
				</div>
				
				<div class="mt-2">
					pw : <input type="password" name="pw" class="form-control">
				</div>
				
				<div class="mt-3">
					<button type="submit" class="btn btn-light">로그인</button>
				</div>
			</form>
		</div>
		<div class="col"></div>
	</div>
	
</body>
</html>

 

id값과 pw값을 getParameter()로 받았다.

WHERE 조건을 id와 pw가 모두 맞을때 SELECT하게 하는 sql문을 작성했다.

DB를 초기화 및 연결하고 

DB의 id, pw와 맞다면 empList를 sendRedirect로 응답하고

그렇지 않다면 loginForm으로 다시 돌아가게 응답했다.

loginAction.jsp

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

<%
	// 1. 요청 분석
	request.setCharacterEncoding("UTF-8");
	String id = request.getParameter("id");
	String pw = request.getParameter("pw");
	
	// 디버깅 코드(값 체크)
	System.out.println("id = " + id);
	System.out.println("pw = " + pw);
	
	// 2. 비지니스 코드
	String sql = "SELECT id FROM member	WHERE id = ? AND pw = ?";
	Class.forName("org.mariadb.jdbc.Driver");
	
	// DB자원 초기화
	Connection conn = null; 
	PreparedStatement stmt = null;
	ResultSet rs = null;
	
	conn = DriverManager.getConnection("jdbc:mariadb://127.0.0.1:3307/gdj80","root","****");
	
	stmt = conn.prepareStatement(sql);
	stmt.setString(1, id);
	stmt.setString(2, pw);
	
	rs = stmt.executeQuery();
	
	System.out.println(stmt);
			
	// 3. 결과 분기
	// 로그인 성공시 -> /crudtest/cityboard/cityboardList.jsp
	// 로그인 실패시 -> /crudtest/loginForm.jsp

	if(rs.next()) {
		response.sendRedirect("/crudtest/emp/empList.jsp");
	} else {
		response.sendRedirect("/crudtest/loginForm.jsp");
	}
	
	// DB자원 반납
	rs.close();
	stmt.close();
	conn.close();
%>

 

 

728x90

'웹 개발' 카테고리의 다른 글

css,bootstrap사용해서 게시판만들기(1)  (0) 2024.03.21
JSP와 MariaDB 연동하기(7)  (0) 2024.03.18
JSP와 MariaDB 연동하기(5)  (0) 2024.03.15
JSP와 MariaDB 연동하기(4)  (0) 2024.03.14
JSP와 MariaDB 연동하기(3)  (0) 2024.03.14