티스토리 뷰

반응형

* 홈페이지에서 회원가입과 로그인을 해보자

 

1. 첫 로그인 폼 화면

 

 

 

2. 홈페이지에 회원가입을 합니다.

 

 

 

3. 회원가입한 정보가 db에 저장됩니다. 이때 세션에 id가 등록됩니다

 

 

 

 

4. 회원가입 후 로그인을 합니다.

 

 


5. 로그인 정보가 올바르면 main 화면으로 이동하고, 정보가 틀리면 정보를 다시 입력하라고 경고창이 뜹니다.

 

 

 

 

 

6. main 창에서 내 정보를 보러 페이지 이동을 한 뒤 내 정보만 받아와서 볼 수 있습니다.

 

 

 

 

 

7. 관리자 id는 admin 입니다. admin 계정으로 접속 했을때 회원가입한 모든 사람들의 정보를 볼 수 있습니다.

 

 

 

 

 

8. 관리자 모드 일때 회원들을 삭제가 가능합니다. 삭제 했을때 DB에 있는 데이터도 삭제 됩니다.

 

 

 

 

 

9. 개인 사용자 모드 일때 각 개인의 정보를 수정할 수 있습니다. 수정 했을때 DB에 있는 데이터도 수정 됩니다.

이때, 아이디와 이름, 주민번호, 생일은 수정할 수 없습니다.

 

 

 

 

 

10. 로그아웃을 다시 로그인 화면으로 돌아갑니다. 이때 세션이 끊어집니다.

 

 

 

 

* 코드

 

- 총 jsp 파일은 9개, JavsScript 파일은 1개 입니다.

- JavsScript 문서는 회원가입 유효성을 검사하는 문서입니다.

 

Pro-db.zip

 

GitHub : https://github.com/jerry9349/BITReport/commit/3d97c34be93a3b1799e6c6f38f4e56bc7db68109

 

 

 

 

* Login.jsp

- 로그인 폼을 제공하는 jsp 공간 입니다.

- 로그인 화면으로 오면 세션이 모두 끊어 집니다.

 

1
2
<!-- 로그인 화면으로 돌아오면 세션 종료 -->
    <% session.invalidate(); %>
cs

 

 

 

 

 

* join.jsp

- 회원가입 폼 입니다.

- 폼태그를 이용하여 db에 저장되는 페이지로 이동합니다.

- onsubmint 은 JavaScript 문서에서 함수를 호출하는 용도로 쓰입니다. 회원가입 유효성을 검사할때 사용합니다.

 

1
2
<FORM name="f" method="post" action="db2.jsp" onsubmit="return validate()">
</FORM>
cs

 

 

 

 

 

* db2.jsp(joinDB)

- 회원가입한 데이터를 db에 넣는 jsp 파일입니다.

- db에 넣고 main으로 이동합니다.

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
<%        //db 접속할 객체 만들기
        Connection conn = null;
        //회원가입해서 db에 추가할 쿼리문 
        String sql = "INSERT INTO jointest values ('" + id + "'," + "'" + pwd + "'," 
                + "'" + mail + "'," + "'" + name + "'," + "'" + num1 + "'," + "'" + num2 + "'," 
                + "'" + year + "'," + "'" + month + "'," + "'" + day + "'," + "'" + chk + "'," 
                + "'" + intro + "')";
        try {
            //context.xml 불러오기
            Context init = new InitialContext();
            //connection pool에서 설정된 경로, java 경로에 들어있는 context.xml의 name인 jdbc/OracleDB의 경로를 가져옴
            DataSource ds = (DataSource) init.lookup("java:comp/env/jdbc/OracleDB");
            //내 db 경로를 가져와서 접속함
            conn = ds.getConnection();
            //db에 sql문 보내기
            PreparedStatement pstmt = conn.prepareStatement(sql);
            //db 업데이트
            pstmt.executeUpdate();
 
            out.println("<h3>연결되었습니다.</h3>");
        } catch (Exception e) {
            out.println("<h3>연결에 실패하였습니다.</h3>");
            e.printStackTrace();
        }finally{
            conn.close();
        }
        //db에 데이터를 전부 넣으면 main 화면으로 이동
        response.sendRedirect("main.jsp");
    %>
cs

 

 

 

 

 

 

* db3.jsp(LoginDB)

- 로그인 했을때 로그인 정보를 db 정보와 비교하는 jsp 파일입니다.

- 로그인 데이터가 db 안의 데이터와 일치할때 main 으로 이동합니다.

 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<%            //만약 db안에 값이 들어 있을때
            if (rs.next()) {
                //로그인폼에 입력한 id와 비밀번호가 db안에 있는 id와 비밀번호와 일치할때 메인 페이지로 이동
                if (id.equals(rs.getString("id")) == true & pwd.equals(rs.getString("pwd")) == true) {
                    rs.close();
                    response.sendRedirect("main.jsp");
                }else if(id.equals(rs.getString("id")) == true & pwd.equals(rs.getString("pwd")) == false){
                    rs.close();
                    %>
                    <script>
                        alert("아이디나 비밀번호가 잘못되었습니다.");
                        history.back();
                    </script><%
                }
            } else {//만약 db안에 값이 없을때
                rs.close();
    %>
    <script>
        alert("아이디나 비밀번호가 잘못되었습니다.");
        history.back();
    </script>
    <%
}%>
cs

 

 

 

 

 

* main.jsp

- 메인 화면 입니다.

- 로그인 id가 admin일때 관리자 화면을 띄우고,

- 로그인 id가 사용자일때 사용자 화면을 띄웁니다.

 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
if(id.equals(admin)){
        String sql = "SELECT * FROM jointest";
        PreparedStatement pstmt = conn.prepareStatement(sql);
        ResultSet rs = pstmt.executeQuery();
        %>
        
        <h1>관리자로 로그인 하셨습니다.</h1><br><br>
        <a href="output.jsp">관리자 정보 보러가기</a>
        
        <%
        rs.close();
    }else{
        //사용자 모드 일때 오직 사용자 개인의 정보만 가져올 수 있다.
        String sql = "SELECT * FROM jointest WHERE id='"+id+"'";
        PreparedStatement pstmt = conn.prepareStatement(sql);
        ResultSet rs = pstmt.executeQuery();
        %>
        
        <h1><%= session.getAttribute("id") %> 로그인 하셨습니다.</h1><br><br>
        <a href="output.jsp">내 정보 보러가기</a>
        <%
        rs.close();
    }
cs

 

 

 

* output.jsp

- 정보를 출력하는 jsp 파일 입니다.

- 로그인 id가 admin일때 관리자 화면을 띄우고,

- 로그인 id가 사용자일때 사용자 화면을 띄웁니다.

 

 

 

 

* delete.jsp

- 삭제 할 수있는 jsp 파일입니다.

- 로그인 id가 admin일때만 삭제를 할 수 있고,

- 삭제한 데이터는 db 안에서도 삭제되어야 합니다.

 

1
2
3
4
String id = (String) request.getParameter("id");
 
//만약 내가 삭제할 id가 db안에 있는 id와 같을때 삭제할 쿼리문
String sql = "DELETE FROM jointest WHERE id='" + id + "'";
cs

 

 

 

 

 

* update.jsp

- 수정할 수 있는 수정 폼을 제공합니다.

- 수정한 값을 들고 db에 수정할 수 있는 페이지로 이동해야 합니다.

 

1
2
<FORM name="f" method="post" action="change.jsp" onsubmit="return validate()">
</FORM>
cs

 

 

 

 

 

* change.jsp

- 수정한 값을 받아 db에 수정해줘야합니다.

1
2
3
String sql = "UPDATE jointest SET pwd='" + pwd + "', mail='" + mail + "',chk='" 
            + chk + "',intro='" + intro + "' WHERE id='" + session.getAttribute("id"+ "'";
 
cs

 

 

 

 

반응형
댓글
공지사항