[JSP] 회원가입 실습

WEB/JSP 2022. 10. 11. 16:57

joinForm.jsp

<%--
  Created by IntelliJ IDEA.
  User: UserK
  Date: 2022-10-11
  Time: 오후 2:05
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<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.0">
    <title>Document</title>
    <style>
        table, th, td {
            border: 0.5px solid skyblue;
        }
    </style>
</head>
<body>
<form action="joinProcess.jsp">
    <table align ="center">
        <tr align ="center" bgcolor="skyblue">
            <td colspan = "3"><b>회원 기본 정보</b></td>
        </tr>
        <tr>
            <td align ="center" bgcolor="Silver">아이디:</td>
            <td><input id="id" name="id" type="text" minlength="4" maxlength="12" required> 4~12자의 영문 대소문자와 숫자로만 입력</td>
        </tr>
        <tr>
            <td align ="center" bgcolor="Silver">비밀번호:</td>
            <td><input id="password1" name="pw" type="password" minlength="4" maxlength="12" required> 4~12자의 영문 대소문자와 숫자로만 입력</td>
        </tr>
        <tr>
            <td align ="center" bgcolor="Silver">비밀번호확인:</td>
            <td><input id="password2" name="pw2"  type="password" minlength="4" maxlength="12" required></td>
        </tr>
        <tr>
            <td align ="center" bgcolor="Silver">메일주소:</td>
            <td><input id="email" name="email"  type="email" required> 예) id@domain.com</td>
        </tr>
        <tr>
            <td align ="center" bgcolor="Silver">이름:</td>
            <td><input id="name" name="name" type="text" required></td>
        </tr>
        <tr align ="center" bgcolor="skyblue">
            <td colspan = "3"><b>개인 신상 정보</b></td>
        </tr>
        <tr>
            <td align ="center" bgcolor="Silver">생일:</td>
            <td>
                <input type="text" name="year"  id="birth" minlength="4" maxlength="4" required>년
                <select name="month">
                    <option value="1">1</option>
                    <option value="2">2</option>
                    <option value="3">3</option>
                    <option value="4">4</option>
                    <option value="5">5</option>
                    <option value="6">6</option>
                    <option value="7">7</option>
                    <option value="8">8</option>
                    <option value="9">9</option>
                    <option value="10">10</option>
                    <option value="11">11</option>
                    <option value="12">12</option>
                </select>
                월
                <select name="day">
                    <option value="1">1</option>
                    <option value="2">2</option>
                    <option value="3">3</option>
                    <option value="4">4</option>
                    <option value="5">5</option>
                    <option value="6">6</option>
                    <option value="7">7</option>
                    <option value="8">8</option>
                    <option value="9">9</option>
                    <option value="10">10</option>
                    <option value="11">11</option>
                    <option value="12">12</option>
                    <option value="13">13</option>
                    <option value="14">14</option>
                    <option value="15">15</option>
                    <option value="16">16</option>
                    <option value="17">17</option>
                    <option value="18">18</option>
                    <option value="19">19</option>
                    <option value="20">20</option>
                    <option value="21">21</option>
                    <option value="22">22</option>
                    <option value="23">23</option>
                    <option value="24">24</option>
                    <option value="25">25</option>
                    <option value="26">26</option>
                    <option value="27">27</option>
                    <option value="28">28</option>
                    <option value="29">29</option>
                    <option value="30">30</option>
                    <option value="31">31</option>
                </select>
                일
            </td>
        </tr>
        <tr>
            <td align ="center" bgcolor="Silver" required>관심분야:</td>
            <td>
                <input type="checkbox" name="inter" value="컴퓨터">컴퓨터
                <input type="checkbox" name="inter" value="인터넷">인터넷
                <input type="checkbox" name="inter" value="여행">여행
                <input type="checkbox" name="inter" value="영화감상">영화감상
                <input type="checkbox" name="inter" value="음악감상">음악감상
            </td>
        </tr>
        <tr>
            <td align ="center" bgcolor="Silver">자기소개:</td>
            <td><textarea name="intro" id="area" cols="60" rows="7" required></textarea></td>
        </tr>
    </table>
    <br>
    <div align="center">
        <input type="button" value="회원가입" onclick="sub(this)">
        <input type="reset" value="다시입력">
    </div>
</form>
<script>
    var arr = [];
    var i = 0;
    for(var j = 48; j < 58; j++){
        arr[i++] = j;
    }
    for(var j = 65; j < 91; j++){
        arr[i++] = j;
    }
    for(var j = 97; j < 124; j++){
        arr[i++] = j;
    }

    function sub(self){
        // ----------아이디----------
        var id = document.querySelector("#id");
        var value = id.value;
        var idArr = value.split("");

        if(idArr.length > 12 || idArr.length < 4){
            alert("아이디는 4~12자로 입력해주세요.");
            return;
        }

        if(check(idArr, "아이디") == false){ return }
        // ----------비밀번호----------
        var password1 = document.querySelector("#password1");
        value = password1.value;
        idArr = value.split("");

        if(idArr.length > 12 || idArr.length < 4){
            alert("비밀번호는 4~12자로 입력해주세요.");
            return;
        }

        if(check(idArr, "비밀번호") == false){ return }
        // ----------비밀번호 확인----------
        var password2 = document.querySelector("#password2");
        if(value != password2.value){
            alert("일치하지 않는 비밀번호 입니다.");
            return;
        }

        // ----------이메일----------
        var email = document.querySelector("#email");
        idArr = email.value.split("@");

        if(idArr.length != 2){
            alert("이메일 형식에 맞지 않습니다.");
            return
        }else{
            var first = idArr[0].split("");
            if(check(first, "이메일") == false){ return }

            idArr = idArr[1].split(".");
            if(idArr.length != 2){
                alert("이메일 형식에 맞지 않습니다.");
                return
            }else{
                if(idArr[0] == ""){
                    alert("이메일 형식에 맞지 않습니다.");
                    return
                }else{
                    var second = idArr[0].split("");
                    if(check2(second, "이메일") == false){ return }

                    var third = idArr[1].split("");
                    if(check2(third, "이메일") == false){ return }
                }
            }
        }
        // ----------생일----------
        var birth = document.querySelector("#birth");
        if(birth.value.length != 4){
            alert("년도는 4글자 숫자로 작성해주세요."); return;
        }

        idArr = birth.value.split("");
        var j = 0;
        var ascArr = [];    // 숫자 아스키코드
        for(var i = 48; i < 58; i++){
            ascArr[j] = i;
            j++;
        }
        if(check(idArr, "년도") == false){ return }
        // ----------관심분야----------
        var inter = document.getElementsByName("inter");
        var count = 0;
        for(var i = 0; i < inter.length; i++){
            if(inter[i].checked){ count++; }
        }
        if(count == 0){ alert("관심분야를 체크해주세요."); return;}

        // ----------자기소개----------
        var area = document.querySelector("#area");
        if(area.value.length < 11){
            alert("자기소개는 10글자 이상 작성해주세요."); return;
        }

        self.setAttribute('type', 'submit');
    }

    function check(idArr, str){
        for(var i = 0 ; i < idArr.length; i++){
            var asc = idArr[i].charCodeAt(0);
            if(arr.indexOf(asc) == -1){
                alert(str + "형식에 맞지 않습니다.");
                return false;
            }
        }
    }

    function check2(idArr, str){
        var j = 0;
        var arr2 = [];    // 영어
        for(var i = 65; i < 91; i++){
            arr2[j] = i;
            j++;
        }
        for(var i = 97; i < 123; i++){
            arr2[j] = i;
            j++;
        }
        for(var i = 0 ; i < idArr.length; i++){
            var asc = idArr[i].charCodeAt(0);
            if(arr2.indexOf(asc) == -1){
                alert(str + "형식에 맞지 않습니다.");
                return false;
            }
        }
    }
</script>
</body>
</html>

joinProcess.jsp

<%--
  Created by IntelliJ IDEA.
  User: UserK
  Date: 2022-10-11
  Time: 오후 2:05
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@page import= "java.sql.*" %>
<%@page import= "javax.sql.*" %>
<%@page import= "javax.naming.*" %>

<%
    String id = request.getParameter("id");

    Connection conn = null;

    String sql1 = "select * from userInfo where id = ?";
    try{
        Context init = new InitialContext();
        DataSource ds = (DataSource) init.lookup("java:comp/env/jdbc/OracleDB");
        conn = ds.getConnection();

        PreparedStatement stmt = conn.prepareStatement(sql1);
        stmt.setString(1, id);
        ResultSet rs = stmt.executeQuery();

        if(rs.next()){
            out.println("<script>alert('이미 존재하는 아이디 입니다.') location.href='joinForm.jsp'</script>");
        }else{
            String year = request.getParameter("year");
            String month = request.getParameter("month");
            String day = request.getParameter("day");

            String[] interest = request.getParameterValues("inter");
            String inter = "";
            for(int i = 0; i < interest.length; i++) {
                if(i != interest.length - 1){
                    inter += interest[i] + ", ";
                }else{
                    inter += interest[i];
                }
            }

            String sql2 = "INSERT INTO userInfo VALUES('"+ id +"', '" + request.getParameter("pw") + "', '"
                    + request.getParameter("email") + "', '" + request.getParameter("name") + "', '"
                    + year + "/" + month + "/" + day + "', '" + inter + "', '" + request.getParameter("intro") + "')";

            Statement stmt2 = conn.createStatement();

            System.out.println(sql2);
            if(stmt2.executeUpdate(sql2)!=0){
                out.println("<script>location.href = 'loginForm.jsp'</script>");
            }else{
                out.println("<h3>다시 도전</h3>");
            }
            stmt2.close();
        }
        stmt.close();

    }catch(Exception e){
        out.println("<h3>데이터 삽입 실패<h3>");
        e.printStackTrace();
    }
%>
<html>
<head>
    <title>Title</title>
</head>
<body>

</body>
</html>

loginForm.jsp

<%--
  Created by IntelliJ IDEA.
  User: UserK
  Date: 2022-10-11
  Time: 오후 2:04
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
    String user_id = (String)session.getAttribute("id");
    if(user_id != null){
%>
    <script type="text/javascript">
        location.href = 'Main.jsp'
    </script>
<%
    }
%>
<html>
<head>
    <title>Title</title>
</head>
<body>
    <form action="loginProcess.jsp">
        <table>
            <tr>
                <td>로그인 페이지</td>
            </tr>
            <tr>
                <td>아이디: </td>
                <td><input name="id" type="text"/></td>
            </tr>
            <tr>
                <td>비밀번호: </td>
                <td><input name="pw" type="password"/></td>
            </tr>
            <tr>
                <td><button type="submit">로그인</button>
                    <button type="button" onclick="location.href='http://localhost:8080/test_war_exploded/login/joinForm.jsp'">회원가입</button>
                    </td>
            </tr>
        </table>
    </form>
</body>
</html>

loginProcess.jsp

<%--
  Created by IntelliJ IDEA.
  User: UserK
  Date: 2022-10-11
  Time: 오후 2:05
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@page import= "java.sql.*" %>
<%@page import= "javax.sql.*" %>
<%@page import= "javax.naming.*" %>

<%
    String id = request.getParameter("id");
    String pw = request.getParameter("pw");
    Connection conn = null;

    String sql1 = "select * from userInfo where id = '"+id+"'";
    try{
        Context init = new InitialContext();
        DataSource ds = (DataSource) init.lookup("java:comp/env/jdbc/OracleDB");
        conn = ds.getConnection();

        Statement stmt = conn.createStatement();
        ResultSet rs = stmt.executeQuery(sql1);
        System.out.println(stmt);
        System.out.println(sql1);
        if(rs.next()){
            String sql2 = "select pw from userInfo where id = '" + id +"'";
            System.out.println(sql2);
            Statement stmt2 = conn.createStatement();
            ResultSet rs2 = stmt2.executeQuery(sql2);
            if(rs2.next()) {
                String checkPw = rs2.getString(1);
                if(checkPw.equals(pw)){
                    session.setAttribute("id", id);
                    out.println("<script>location.href = 'Main.jsp'</script>");
                }else{
                    out.println("<script>alert('잘못된 비밀번호입니다.')</script>");
                }
            }
        }else{
            out.println("<script>alert('존재하지 않는 아이디입니다.')</script>");
        }
        stmt.close();

    }catch(Exception e){
        out.println("<h3>데이터 삽입 실패<h3>");
        e.printStackTrace();
    }
%>
<html>
<head>
    <title>Title</title>
</head>
<body>

</body>
</html>

logout.jsp

<%--
  Created by IntelliJ IDEA.
  User: UserK
  Date: 2022-10-11
  Time: 오후 3:43
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
  session.invalidate();
  out.println("<script>location.href = 'loginForm.jsp'</script>");
%>
<html>
<head>
    <title>Title</title>
</head>
<body>

</body>
</html>

Main.jsp

<%--
  Created by IntelliJ IDEA.
  User: UserK
  Date: 2022-10-11
  Time: 오후 2:05
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
    String user_id = (String)session.getAttribute("id");
    if(user_id.equals("admin")){
%>
        <a href="Member_list.jsp">관리자모드 접속(회원 목록)</a>
<%
    }
%>
<html>
<head>
    <title>Title</title>
</head>
<body>
    <h3>'<%=user_id%>'로 로그인하셨습니다.</h3>
    <button onclick="location.href='http://localhost:8080/test_war_exploded/login/logout.jsp'">로그아웃</button>
</body>
</html>

Member_list.jsp

        <%--
  Created by IntelliJ IDEA.
  User: UserK
  Date: 2022-10-11
  Time: 오후 2:05
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@page import= "java.sql.*" %>
<%@page import= "javax.sql.*" %>
<%@page import= "javax.naming.*" %>
<%@ page import="java.util.ArrayList" %>
<%
    String user_id = (String)session.getAttribute("id");
    if(!user_id.equals("admin")){
%>
        <script>location.href = 'Main.jsp'</script>
<%
    }
    Connection conn = null;

    String sql1 = "select id from userInfo";
    ArrayList<String> arr = null;
    try {
        Context init = new InitialContext();
        DataSource ds = (DataSource) init.lookup("java:comp/env/jdbc/OracleDB");
        conn = ds.getConnection();

        PreparedStatement stmt = conn.prepareStatement(sql1);
        ResultSet rs = stmt.executeQuery();
        arr = new ArrayList<String>();
        while (rs.next()) {
            arr.add(rs.getString(1));
        }
        stmt.close();

    } catch (Exception e) {
        out.println("<h3>데이터 삽입 실패<h3>");
        e.printStackTrace();
    }
%>
<html>
<head>
    <title>Title</title>
</head>
<body>
    <table>
        <tr colspan="2" align ="center">
            <td>회원 목록</td>
        </tr>
        <%
            for (int i = 0; i < arr.size(); i++) {
        %>
                <tr>
                    <td>
                        <a href="Member_info.jsp?id=<%=arr.get(i)%>"><%=arr.get(i)%></a>
                    </td>
                    <td>
                        <a href="Member_delete.jsp?id=<%=arr.get(i)%>">삭제</a>
                    </td>
                </tr>

        <%    }        %>
    </table>
</body>
</html>

Member_info.jsp

<%--
  Created by IntelliJ IDEA.
  User: UserK
  Date: 2022-10-11
  Time: 오후 2:05
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@page import= "java.sql.*" %>
<%@page import= "javax.sql.*" %>
<%@page import= "javax.naming.*" %>
<%
    String user_id = (String)session.getAttribute("id");
    if(!user_id.equals("admin")){
        %>
        <script>location.href = 'Main.jsp'</script>
        <%
    }
    String id = request.getParameter("id");
    Connection conn = null;

    String sql1 = "select * from userInfo where id = '" + id + "'";
    try {
        Context init = new InitialContext();
        DataSource ds = (DataSource) init.lookup("java:comp/env/jdbc/OracleDB");
        conn = ds.getConnection();

        PreparedStatement stmt = conn.prepareStatement(sql1);
        ResultSet rs = stmt.executeQuery();
        System.out.println(sql1);
        if (rs.next()) {
            out.println("<h3>아이디: " + rs.getString(1) +"</h3>");
            out.println("<h3>이메일: " + rs.getString(3) +"</h3>");
            out.println("<h3>이름: " + rs.getString(4) +"</h3>");
            String[] birth = rs.getString(5).split(" ");
            out.println("<h3>생일: " + birth[0] +"</h3>");
            out.println("<h3>취미: " + rs.getString(6) +"</h3>");
            out.println("<h3>자기소개: " + rs.getString(7) +"</h3>");
        }
        stmt.close();

    } catch (Exception e) {
        out.println("<h3>실패<h3>");
        e.printStackTrace();
    }
%>
<html>
<head>
    <title>Title</title>
</head>
<body>

</body>
</html>

Member_delete.jsp

<%--
  Created by IntelliJ IDEA.
  User: UserK
  Date: 2022-10-11
  Time: 오후 2:05
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@page import= "java.sql.*" %>
<%@page import= "javax.sql.*" %>
<%@page import= "javax.naming.*" %>
<%
    String user_id = (String)session.getAttribute("id");
    if(!user_id.equals("admin")){
%>
        <script>location.href = 'Main.jsp'</script>
<%
    }
    String id = request.getParameter("id");
    Connection conn = null;

    String sql1 = "delete from userInfo where id = '" + id + "'";
    try {
        Context init = new InitialContext();
        DataSource ds = (DataSource) init.lookup("java:comp/env/jdbc/OracleDB");
        conn = ds.getConnection();

        PreparedStatement stmt = conn.prepareStatement(sql1);

        if(stmt.executeUpdate()!=0){
            out.println("<script>location.href = 'Member_list.jsp'</script>");
        }
        stmt.close();

    } catch (Exception e) {
        out.println("<h3>실패<h3>");
        e.printStackTrace();
    }
%>
<html>
<head>
    <title>Title</title>
</head>
<body>

</body>
</html>

728x90

저작자표시 비영리 변경금지

'WEB > JSP' 카테고리의 다른 글

[JSP] MVC2 패턴 게시판 예제 (1)	2022.10.13
JDBC&JSP 실습 (1)	2022.10.07
[JSP] 자바 useBean 액션태그 간단한 회원가입 (0)	2022.09.21
[JSP] 간단한 쇼핑몰 장바구니 (2)	2022.09.20
[JSP] JSP forward (0)	2022.09.19

ABOUT ME

응애 개발자 응애 개발자

'WEB > JSP' 카테고리의 다른 글

티스토리툴바

ABOUT ME

'WEB > JSP' 카테고리의 다른 글

관련글 관련글 더보기

티스토리툴바