N스크린하이브리드앱과정/JSP:Model-1

[5주][2일][5~8th] JSP: 회원수정, 회원삭제, 로그인 폼 구현하기

광천스러움 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>

 

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

경고창이 뜨면서

뒤로가기버튼을 누르면

 

세션값 있음으로 변했다

 

로그아웃 버튼을 누르면

 

경고창 뜨면서

 

세션값 없음이 뜬다

 

다시 돌아와 로그인 하면

 

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

 

아래와 같은 정보가 뜬다