ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • [5주][2일][5~8th] JSP: 회원수정, 회원삭제, 로그인 폼 구현하기
    N스크린하이브리드앱과정/JSP:Model-1 2013. 8. 13. 18:16

    ☆ 실습(1) : "회원수정" 폼 만들기

    1. updateForm.jsp

    <h1>회원수정</h1>
    <form action="updatePro.jsp" method="post">
    아이디: <input type="text" name="id"><br>
    패스워드: <input type="password" name="passwd"><br>
    수정할 이름: <input type="text" name="name"><br>
    <input type="submit" value="회원수정"><br>
    </form>

     

    2. updatePro.jsp

    <%
      // 한글처리
      request.setCharacterEncoding("utf-8");
      // id passwd name가져오기
      String id = request.getParameter("id");
      String passwd = request.getParameter("passwd");
      String name = request.getParameter("name");
      ResultSet rs = null;
      try {
       // 1단계 드라이버로더
       Class.forName("com.mysql.jdbc.Driver");
       // 2단계 디비연결
       Connection con = null;
       String url = "jdbc:mysql://localhost:3306/jspbeginner";
       String user = "jspid";
       String pwd = "jsppass";

       con = DriverManager.getConnection(url, user, pwd);
       // 3단계 : id에 해당하는 passwd를 가져오는 sql(sql 생성)
       PreparedStatement pstmt = null;
       String sql = "";
       
       sql = "select passwd from member where id=?";
       pstmt = con.prepareStatement(sql);
       pstmt.setString(1, id);
       // 4단계 실행 => rs저장
       rs = pstmt.executeQuery();
       // 5단계 rs 데이터있으면 id있음
       //   폼비밀번호 rs비밀번호 비교 맞으면 => 수정
       //                     틀리면 => 비밀번호틀림
       //            없으면 id없음
       if(rs.next()){
        //id있음
    //     rs.getString(1);
        String dbPass=rs.getString("passwd");
        if(passwd.equals(dbPass)){
         //비밀번호 맞음 수정
         sql = "update member set name=? where id=? and passwd=?";
         pstmt=con.prepareStatement(sql);
         pstmt.setString(1, name);
         pstmt.setString(2, id);
         pstmt.setString(3, passwd);
            
         // 4단계 실행
         pstmt.executeUpdate(); //insert,update,delete
         out.println("정보수정 성공!");
        }else{
         out.println("비밀번호 틀림!");
        }    
       }else{
        out.println("id가 존재하지 않아여");//id없음
       }
       
      } catch (Exception e) {
       e.printStackTrace();
      }finally{
       
      }
     %>

     

    만들어 놓은 회원정보들

     

    회원수정 창

     

    아이디랑 패스워드가 맞아 해당 이름이 "광천수"로 변경!

     

    "칸쵸맛있겠다"가 "광천수"로 바뀜

     

     

     

    ☆ 실습(2) : "회원삭제" 폼 만들기

    1. deleteForm.jsp

    <h1>회원삭제</h1>
    <form action="deletePro.jsp" method="post">
    아이디: <input type="text" name="id"><br>
    패스워드: <input type="password" name="passwd"><br>
    <input type="submit" value="회원삭제"><br>
    </form>

     

    2. deletePro.jsp

    <%
      // 한글처리
      request.setCharacterEncoding("utf-8");
      // id passwd name가져오기
      String id = request.getParameter("id");
      String passwd = request.getParameter("passwd");
      ResultSet rs = null;
      
      Connection con = null;
      String url = "jdbc:mysql://localhost:3306/jspbeginner";
      String user = "jspid";
      String pwd = "jsppass";
      
      PreparedStatement pstmt = null;
      String sql = "";
      try {
       // 1단계 드라이버로더
       Class.forName("com.mysql.jdbc.Driver");
       // 2단계 디비연결
       con = DriverManager.getConnection(url, user, pwd);
       // 3단계 : id에 해당하는 passwd를 가져오는 sql(sql 생성)
       sql = "select passwd from member where id=?";
       pstmt = con.prepareStatement(sql);
       pstmt.setString(1, id);
       // 4단계 실행 => rs저장
       rs = pstmt.executeQuery();
       // 5단계 rs 데이터있으면 id있음
       //   폼비밀번호 rs비밀번호 비교 맞으면 => 수정
       //                     틀리면 => 비밀번호틀림
       //            없으면 id없음
       if(rs.next()){
        //id있음
    //     rs.getString(1);
        String dbPass=rs.getString("passwd");
        if(passwd.equals(dbPass)){
         //비밀번호 맞음 수정
         sql = "delete from member where id=?";
         pstmt=con.prepareStatement(sql);
         pstmt.setString(1, id);
         
         // 4단계 실행
         pstmt.executeUpdate(); //insert,update,delete
         out.println("삭제 성공!");
        }else{
         out.println("비밀번호 틀림!");
        }    
       }else{
        out.println("id가 존재하지 않아여");//id없음
       }
       
      } catch (Exception e) {
       e.printStackTrace();
      }finally{
       //rs!=null : 기억장소가 확보되어 있다는 뜻
       if(rs!=null)try{rs.close();}catch(SQLException ex){}
       if(pstmt!=null)try{pstmt.close();}catch(SQLException ex){}
       if(con!=null)try{con.close();}catch(SQLException ex){}
      }
     %>

     

    회원삭제 폼

     

    아이디랑 패스워드가 맞아 해당 행의 삭제 성공!

     

    아이디 opr 행이...

     

    없어짐!!

     

    이번엔 일부러 아이디를 틀리게 해봄!

     

    친절하게 설명이 뜸

     

    아이디는 맞는데 비번을 틀리게 넣어봄

     

    역시 친절함

     

     

     

    ☆ 실습(3) : "로그인" 폼 만들기 - session값 이용

    1. loginForm.jsp

    <h1>로그인</h1>
    <form action="loginPro.jsp" method="post">
    아이디: <input type="text" name="id"><br>
    패스워드: <input type="password" name="passwd"><br>
    <input type="submit" value="로그인"><br>
    </form>

     

    2. loginPro.jsp

    <%
    //id passwd가져오기
    request.setCharacterEncoding("utf-8");
    String id = request.getParameter("id");
    String passwd = request.getParameter("passwd");
    ResultSet rs = null;
    Connection con = null;
    String url = "jdbc:mysql://localhost:3306/jspbeginner";
    String user = "jspid";
    String pwd = "jsppass";
    PreparedStatement pstmt = null;
    String sql = "";
    try{
     //1단계 드라이버로더
     Class.forName("com.mysql.jdbc.Driver");
     //2단계 디비연결
     con = DriverManager.getConnection(url, user, pwd);
     //3단계 id에 해당하는 passwd가져오기
     sql = "select passwd from member where id=?";
       pstmt = con.prepareStatement(sql);
       pstmt.setString(1, id);
     //4단계 실행 => rs
     rs = pstmt.executeQuery();
     //5단계 데이터가 있으면 아이디있음
     if(rs.next()){
      //id있음
    //   rs.getString(1);
      String dbPass=rs.getString("passwd");
      if(passwd.equals(dbPass)){
       //비밀번호비교 맞으면 세션값생성 "id"
       //    이동 main.jsp
       session.setAttribute("id", id);
       %>
       <script type="text/javascript">
       alert("세션값 생성");
       location.href="main.jsp";
       </script>
       <%
      }else{
       %>
       <script type="text/javascript">
       alert("비밀번호 틀려써여");
       history.back();
       </script><%
      }
     }else{
      %>
      <script type="text/javascript">
      alert("id가 존재하지 않아여");
      history.back();
      </script><%
     }
    }catch (Exception e) {
     e.printStackTrace();
    }finally{
     //rs!=null : 기억장소가 확보되어 있다는 뜻
     if(rs!=null)try{rs.close();}catch(SQLException ex){}
     if(pstmt!=null)try{pstmt.close();}catch(SQLException ex){}
     if(con!=null)try{con.close();}catch(SQLException ex){}
    }
    %>

     

    로그인 창. id를 안맞게 해봄

     

    안맞다고 뜨면서 자동으로 돌아감

     

    비밀번호를 안맞게 해봄

     

    친절하네

     

    다 맞게 적어봄

     

    세션값 생성되면서 로그인!! 우오오!

     

    새로 만든 main.jsp로 이동함

     

    ☆ 실습(4) : "로그인" 폼 만들기 - session값 이용

    1. loginForm.jsp

    <%
     String id;
     if(session.getAttribute("id")!=null){
      id = "세션값 있음";
     }else{
      id = "세션값 없음";
     }
    %>
    <h1>로그인</h1>
    <form action="loginPro.jsp" method="post">
    아이디: <input type="text" name="id"><br>
    패스워드: <input type="password" name="passwd"><br>
    <input type="submit" value="로그인">
    <input type="button" value="로그아웃" onclick="location.href='logout.jsp'"><br>
    </form>
    <%=id %>

     

    2. loginPro.jsp

    <%
    //id passwd가져오기
    request.setCharacterEncoding("utf-8");
    String id = request.getParameter("id");
    String passwd = request.getParameter("passwd");
    ResultSet rs = null;
    Connection con = null;
    String url = "jdbc:mysql://localhost:3306/jspbeginner";
    String user = "jspid";
    String pwd = "jsppass";
    PreparedStatement pstmt = null;
    String sql = "";
    try{
     //1단계 드라이버로더
     Class.forName("com.mysql.jdbc.Driver");
     //2단계 디비연결
     con = DriverManager.getConnection(url, user, pwd);
     //3단계 id에 해당하는 passwd가져오기
     sql = "select passwd from member where id=?";
       pstmt = con.prepareStatement(sql);
       pstmt.setString(1, id);
     //4단계 실행 => rs
     rs = pstmt.executeQuery();
     //5단계 데이터가 있으면 아이디있음
     if(rs.next()){
      //id있음
    //   rs.getString(1);
      String dbPass=rs.getString("passwd");
      if(passwd.equals(dbPass)){
       //비밀번호비교 맞으면 세션값생성 "id"
       //    이동 main.jsp
       session.setAttribute("id", id);
       %>
       <script type="text/javascript">
       alert("세션값 생성");
       location.href="main.jsp";
       </script>
       <%
      }else{
       %>
       <script type="text/javascript">
       alert("비밀번호 틀려써여");
       history.back();
       </script><%
      }
     }else{
      %>
      <script type="text/javascript">
      alert("id가 존재하지 않아여");
      history.back();
      </script><%
     }
    }catch (Exception e) {
     e.printStackTrace();
    }finally{
     //rs!=null : 기억장소가 확보되어 있다는 뜻
     if(rs!=null)try{rs.close();}catch(SQLException ex){}
     if(pstmt!=null)try{pstmt.close();}catch(SQLException ex){}
     if(con!=null)try{con.close();}catch(SQLException ex){}
    }
    %>

     

    3. main.jsp

    <%
    String id = (String)session.getAttribute("id");
    if(id==null){
     response.sendRedirect("loginForm.jsp");
    }
    %>
    <h1><%=id %>님이 로그인 하셨습니다!</h1>
    <a href="info.jsp">회원정보조회</a><br>
    <input type="button" value="뒤로가기" onclick="location.href='loginForm.jsp'"><br>

     

    4. logout.jsp

    <%
    session.invalidate();
    %>
    <script type="text/javascript">
    alert("가입시데이");
    location.href="loginForm.jsp";
    </script>

     

    5. info.jsp

    <h1>회원정보조회</h1>
    <%
    //세션값 가져오기
    //세션값 없으면 loginForm.jsp이동
    String id = (String)session.getAttribute("id");
    if(id==null)response.sendRedirect("loginForm.jsp");

    request.setCharacterEncoding("utf-8");
    ResultSet rs = null;
    Connection con = null;
    String url = "jdbc:mysql://localhost:3306/jspbeginner";
    String user = "jspid";
    String pwd = "jsppass";
    PreparedStatement pstmt = null;
    String sql = "";

    try{
    //1단계 드라이버로더
    Class.forName("com.mysql.jdbc.Driver");
    //2단계 디비연결
    con = DriverManager.getConnection(url, user, pwd);
    //3단계 id에 해당하는 모든 데이터 가져오기
    sql = "select * from member where id=?";
    pstmt = con.prepareStatement(sql);
    pstmt.setString(1, id);
    //4단계 실행 => rs저장
    rs = pstmt.executeQuery();
    //5단계 데이터가 있으면 rs내용가져와서 출력
    if(rs.next()){
     //id있음
     %>
     아이디:<%=rs.getString("id") %><br>
     비밀번호:<%=rs.getString("passwd") %><br>
     이름:<%=rs.getString("name") %><br>
     가입일:<%=rs.getTimestamp("reg_date") %><br><% 
    }
    }catch (Exception e) {
     e.printStackTrace();
    }finally{
     //rs!=null : 기억장소가 확보되어 있다는 뜻
     if(rs!=null)try{rs.close();}catch(SQLException ex){}
     if(pstmt!=null)try{pstmt.close();}catch(SQLException ex){}
     if(con!=null)try{con.close();}catch(SQLException ex){}
    }
    %>
    <a href="main.jsp">메인화면으로</a>

     

    맞는 아이디/패스워드를 입력함

    경고창이 뜨면서

    뒤로가기버튼을 누르면

     

    세션값 있음으로 변했다

     

    로그아웃 버튼을 누르면

     

    경고창 뜨면서

     

    세션값 없음이 뜬다

     

    다시 돌아와 로그인 하면

     

    로그인이 되고 회원정보조회를 누르면

     

    아래와 같은 정보가 뜬다

Designed by Tistory.