웹사이트나 애플리케이션에서 로그인 시스템은 사용자 인증을 위한 기본적인 기능 중 하나입니다. 로그인 페이지는 사용자에게 안전하고 원활한 접근을 제공하며, 웹사이트의 보안 및 사용자 맞춤형 서비스를 제공합니다. 이 글에서는 로그인 페이지와 아이디/비밀번호 확인 시스템을 어떻게 구현할 수 있는지에 대해 살펴보겠습니다.
1. 로그인 페이지 구현
1.1 로그인 폼 디자인
로그인 페이지의 가장 중요한 요소는 직관적이고 사용자가 쉽게 이해할 수 있는 로그인 폼입니다. 사용자에게 아이디와 비밀번호를 입력받는 폼을 제공하고, 로그인 후 성공 여부에 따라 적절한 안내 메시지를 출력합니다.
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%
String userid = null;
if (session.getAttribute("userid") != null) {
userid = (String) session.getAttribute("userid");
}
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>로그인</title>
</head>
<body>
<h2>로그인</h2>
<%
if (userid == null) {
%>
<form method="post" action="2_login_ok.jsp">
<p>아이디 : <input type="text" name="userid"></p>
<p>비밀번호 : <input type="password" name="userpw"></p>
<p><input type="submit" value="로그인"></p>
<p>아직 회원이 아니신가요? <a href='./2_member.jsp'>회원가입</a></p>
</form>
<%
} else {
%>
<h3><%=userid %>님 환영합니다!</h3>
<p><input type="button" value="로그아웃" onclick="location.href='2_logout.jsp'"></p>
<%
}
%>
</body>
</html>이 코드에서는 사용자가 로그인을 시도할 때 아이디와 비밀번호를 입력받고, 로그인 상태일 경우 사용자에게 환영 메시지를 출력하며, 로그아웃 버튼을 제공합니다.
1.2 로그인 실패 처리
로그인 과정에서 사용자가 입력한 아이디와 비밀번호가 데이터베이스에 존재하지 않을 경우 로그인 실패 메시지를 출력해야 합니다. 이를 통해 사용자는 올바른 아이디와 비밀번호를 입력했는지 다시 확인할 수 있습니다.
<%@page import="java.sql.*"%>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%
String userid = request.getParameter("userid");
String userpw = request.getParameter("userpw");
// db 연결
Connection conn = null;
PreparedStatement pstmt = null;
ResultSet rs = null;
String sql = "";
String url = "jdbc:mysql://localhost:3306/aiclass";
String id = "root";
String pw = "1234";
try {
Class.forName("com.mysql.cj.jdbc.Driver");
conn = DriverManager.getConnection(url, id, pw);
if (conn != null) {
sql = "select mem_idx from tb_member where mem_userid = ? and mem_userpw = ?";
pstmt = conn.prepareStatement(sql);
pstmt.setString(1, userid);
pstmt.setString(2, userpw);
rs = pstmt.executeQuery();
if (rs.next()) {
session.setAttribute("userid", userid);
%>
<script>
alert('로그인 성공했습니다.');
location.href='2_login.jsp';
</script>
<%
} else {
%>
<script>
alert("아이디 또는 비밀번호를 확인하세요.");
history.back();
</script>
<%
}
}
} catch(Exception e) {
e.printStackTrace();
}
%>이 코드에서는 사용자 아이디와 비밀번호가 올바르지 않을 경우 오류 메시지를 출력하고 로그인 페이지로 돌아가도록 처리하고 있습니다.
2. 아이디/비밀번호 확인 시스템
2.1 로그인 성공 후 세션 관리
로그인에 성공한 후, 세션을 통해 사용자의 정보를 저장하고 웹사이트 내 다른 페이지에서 로그인 상태를 유지할 수 있도록 합니다. 이를 통해 사용자 맞춤형 서비스를 제공할 수 있습니다.
<%
if (session.getAttribute("userid") != null) {
String userid = (String) session.getAttribute("userid");
// 로그인된 상태에서 사용자에게 환영 메시지를 출력
out.print("<h3>" + userid + "님 환영합니다!</h3>");
} else {
// 로그인되지 않은 경우 로그인 페이지로 리디렉션
response.sendRedirect("2_login.jsp");
}
%>2.2 로그인 실패 시 사용자 피드백 제공
사용자가 잘못된 아이디나 비밀번호를 입력한 경우, 그에 맞는 오류 메시지를 제공하여 사용자가 로그인 정보를 다시 확인할 수 있도록 합니다. 이는 사용자 경험을 향상시키는 중요한 부분입니다.
마무리
로그인 시스템의 중요성
로그인 시스템은 웹사이트에서 사용자 정보를 안전하게 처리하고, 맞춤형 서비스를 제공하는 데 중요한 역할을 합니다. 로그인 페이지와 확인 시스템을 잘 구현하면 사용자 경험을 개선할 수 있으며, 사이트의 보안 또한 강화됩니다.
지속적인 보안 강화 필요
로그인 시스템을 구현할 때는 보안도 매우 중요한 요소입니다. 비밀번호 암호화, 세션 관리, SQL 인젝션 방어 등 다양한 보안 기법을 적용하여 사용자의 개인정보를 안전하게 보호할 필요가 있습니다.
전체코드
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%
// 로그인 성공 시 세션아이디 가져옴
String userid = null;
if (session.getAttribute("userid") != null) {
userid = (String)session.getAttribute("userid");
}
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<h2>로그인</h2>
<%
if (userid == null) {
%>
<form method="post" action="2_login_ok.jsp">
<p>아이디 : <input type="text" name="userid"></p>
<p>비밀번호 : <input type="password" name="userpw"></p>
<p><input type="submit" value="로그인"></p>
<p>아직 회원이 아니신가요? <a href='./2_member.jsp'>회원가입</a></p>
</form>
<%
} else {
%>
<h3><%=userid %>님 환영합니다!</h3>
<p><input type="button" value="로그아웃" onclick="location.href='2_logout.jsp'"></p>
<%
}
%>
</body>
</html>
아이디 비밀번호 확인 페이지 2_login_ok.jsp
<%@page import="java.sql.*"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%
String userid = request.getParameter("userid");
String userpw = request.getParameter("userpw");
//db 연결
Connection conn = null;
PreparedStatement pstmt = null;
ResultSet rs = null;
String sql = "";
String url = "jdbc:mysql://localhost:3306/aiclass";
String id = "root";
String pw = "1234";
try {
Class.forName("com.mysql.cj.jdbc.Driver");
conn = DriverManager.getConnection(url, id, pw);
if (conn != null) {
sql = "select mem_idx from tb_member where mem_userid = ? and mem_userpw = ?";
pstmt = conn.prepareStatement(sql);
pstmt.setString(1, userid);
pstmt.setString(2, userpw);
rs = pstmt.executeQuery();
if (rs.next()) {
session.setAttribute("userid", userid);
%>
<script>
alert('로그인 성공했습니다.');
location.href='2_login.jsp';
</script>
<%
} else {
%>
<script>
alert("아이디 또는 비밀번호를 확인하세요.");
history.back();
</script>
<%
}
}
} catch(Exception e) {
e.printStackTrace();
}
%>
'JSP' 카테고리의 다른 글
| [JSP] DB 연결 클래스를 싱글톤 패턴으로 구현하기 (0) | 2022.05.25 |
|---|---|
| [JSP] mySQL 사용자 정보 수정 시스템 구현 (0) | 2022.05.25 |
| [JSP] Ajax 이용하여 회원 가입 & 아이디 중복 체크 (mySQL) (0) | 2022.05.24 |
| [JSP] Ajax (0) | 2022.05.24 |
| [JSP] 이클립스 MySQL JDBC 드라이버 추가 (0) | 2022.05.24 |