-
목록에서 게시글로 이동할 때
게시판 목록창에서 사용자가 게시글을 클릭하면 특정 페이지로 이동할 수 있게 a태그를 이용한다.
이 때 primary key로 등록된 no 요소를 URL 뒤쪽에 붙여서 넘겨주는 것이 좋다.
게시글에서 데이터 불러오기
a 태그에 입력된 페이지에서는 파라메터를 받아서 저장하고( number ) , 데이터베이스에 연결해서 해당 자료를 받아온다
* 이 때 파라메터에 저장된 값의 타입에 주의해야한다.
- 명령문에 데이터를 넣을 때 위와 같은 형태면 불편하다.
그래서 prepareStatement를 이용할 수 있다.
prepareStatement사용방법 (교재 P. 401)
1. Connection.prepareStatement() 메서드를 사용해서 PreparedStatement 생성
2. preparedStatement의 set 메서드를 사용해서 필요한 값 지정
3. PreparedStatement의 executeQuery() 또는 executeUpdate() 메서드를 사용해 쿼리 실행
4. finally 블록에서 사용한 PreparedStatement 닫기
pstmt.setType( 1, number ) -> 첫 번째 ? 에 number 입력
글쓰기 방식 ( form 태그 )
- form 태그에 action을 설정하면 submit 했을 때 해당 URL로 이동하면서 파라미터를 만든다.
- 내용을 기입하고 글쓰기 버튼을 누르면
- 다음과 같이 input에 입력된 데이터가 파라미터에 담겨서 action에 적은 URL 로 이동한다.
파라미터의 이름은 input 태그의 name 속성으로 적용된다.
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@ page import="java.sql.*" %> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> </head> <body> <% // request한 데이터가 한글일 때 깨지는 현상 방지 ( post 방식으로 보낼 경우 필요함 ) request.setCharacterEncoding("utf-8"); // input에서 받아온 데이터를 저장 String title = request.getParameter("title"); String content = request.getParameter("content"); Class.forName("com.mysql.jdbc.Driver"); Connection conn = null; ResultSet rs = null; PreparedStatement pstmt = null; try { String jdbcDriver = "jdbc:mysql://localhost:3306/sample?serverTimezone=Asia/Seoul"; String dbUser = "root"; String dbPass = "1234"; conn = DriverManager.getConnection(jdbcDriver,dbUser,dbPass); String query = "insert into board(title,content) values(?,?)"; // query 문장을 prepareStatement로 연결해서 시작. pstmt = conn.prepareStatement(query); pstmt.setString(1,title); pstmt.setString(2,content); pstmt.executeUpdate(); // insert를 실행시킴 response.sendRedirect("board_form.jsp"); // 데이터베이스에 저장 후 페이지 이동 } catch(SQLException ex){ out.println(ex); out.println("DB 연결 실패"); } finally { if(conn != null){ conn.close(); } } %> </body> </html>
- prepareStatement가 쓰기 더 편한 구문이므로, 사용 방법을 숙지하자
게시글에서 수정 및 삭제 등 여러가지 기능
글쓰기 뿐만 아니라, 수정 및 삭제 버튼을 만들고 싶다면,
한개의 form 안에 여러개의 button을 제작하는 방법을 알아야한다.
한개의 Form에서 여러개 Submit 사용하기
Multiple submit in Single Form한개의 태그에서 에서 여러개의 submit 버튼을 사용할 경우가 있습니다.무엇이 가장 우아한 방법일까요?onclick - 1아마 아래와 같은 코드를 많이 보셨을 겁니다. $("#update").clic
kutar37.tistory.com
- 주의 할 점은 action을 공백으로 둬야할 때가 있다.
<form action=""> <table> <tr> <td colspan="2"> <%-- 번호 : <input type="text" name="no" value="<%= rs.getInt("no") %>" readonly> --%> 번호 : <%= rs.getInt("no") %><input type="hidden" name="no" value="<%= rs.getInt("no") %>"> 조회수 : <%= rs.getInt("count") %> 좋아요 : <%= rs.getInt("good") %> </td> </tr> <tr> <td>제목</td> <td> <input type="text" name="title" value="<%= rs.getString("title") %>"> </td> </tr> <tr> <td>내용</td> <td> <textarea name="content" rows="10" cols="30"><%= rs.getString("content") %>"></textarea> </td> </tr> <tr> <td colspan="2"> <input type="submit" value="수정" formaction="modifyBoard.jsp"> <input type="submit" value="삭제" formaction="removeBoard.jsp"> </td> </tr> </table> </form>
- 번호가 새롭게 수정되게 만들기 위해서 input에 2가지 방법이 있다.
- no 는 다음 행동을 할 때 꼭 보내줘야 테이블의 행을 구분할 수 있기 때문에,
input에 넣어줘야한다. 다만 보일 필요가 없거나 수정되지 않아야한다면
위의 2가지 경우를 사용할 수 있다.
삭제
- 게시글의 no만 받아와서 delete명령을 주면 되기 때문에 비교적 간단하다.
회원가입
양식
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> </head> <body> <form action="insertMemberServer.jsp" method="post"> <table> <tr><td>아이디</td></tr> <tr><td><input type="text" name="id"></td></tr> <tr><td>비밀번호</td></tr> <tr><td><input type="password" name="password"></td></tr> <tr><td>이름</td></tr> <tr><td><input type="text" name="name"></td></tr> <tr><td>생년월일</td></tr> <tr> <td> <input type="text" placeholder="년4자" name="year"> <select name="month"> <option value="">월</option> <option value="01">1</option> <option value="02">2</option> <option value="03">3</option> </select> <input type="text" placeholder="일" name="day"> </td> </tr> <tr><td>성별</td></tr> <tr> <td> <select name="gender"> <option value="">성별</option> <option value="m">남</option> <option value="f">녀</option> <option value="n">선택안함</option> </select> </td> </tr> <tr><td>이메일</td></tr> <tr><td><input type="text" name="email"></td></tr> <tr><td>연락처</td></tr> <tr><td><input type="text" name="phone"></td></tr> <tr><td><button>가입하기</button></td></tr> </table> </form> </body> </html>
- 전달하고자 하는 데이터에 name을 붙여서 submit 해야 server와 연결하는 파일에서 해당 데이터들을 불러올 수 있다.
서버에 연결
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@ page import="java.sql.*" %> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> </head> <body> <% // request한 데이터가 한글일 때 깨지는 현상 방지 ( post 방식으로 보낼 경우 필요함 ) request.setCharacterEncoding("utf-8"); // 사용자가 입력한 값들 String id = request.getParameter("id"); String password = request.getParameter("password"); String name = request.getParameter("name"); String birthday = request.getParameter("year")+request.getParameter("month")+request.getParameter("day"); String gender = request.getParameter("gender"); String email = request.getParameter("email"); String phone = request.getParameter("phone"); Class.forName("com.mysql.jdbc.Driver"); Connection conn = null; ResultSet rs = null; PreparedStatement pstmt = null; try { String jdbcDriver = "jdbc:mysql://localhost:3306/sample?serverTimezone=Asia/Seoul"; String dbUser = "root"; String dbPass = "1234"; conn = DriverManager.getConnection(jdbcDriver,dbUser,dbPass); String query = "insert into member values(?,?,?,?,?,?,?)"; pstmt = conn.prepareStatement(query); pstmt.setString(1,id); pstmt.setString(2,password); pstmt.setString(3,name); pstmt.setString(4,birthday); pstmt.setString(5,gender); pstmt.setString(6,email); pstmt.setString(7,phone); pstmt.executeUpdate(); response.sendRedirect("member.jsp"); } catch(SQLException ex){ out.println(ex); out.println("DB 연결 실패"); } finally { if(conn != null){ conn.close(); } } %> </body> </html>
- 회원가입 페이지에서 보낸 데이터를 받아서 저장하고 query 문장으로 만들어서 실행시킨다.
- 입력한 데이터가 저장된 모습
로그인
로그인 폼
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> </head> <body> <form action="LoginServer.jsp"> <table> <tr> <td>아이디</td> <td><input type="text" name="id"></td> </tr> <tr> <td>비밀번호</td> <td><input type="password" name="password"></td> </tr> <tr> <td colspan="2"><button>로그인</button></td> </tr> </table> </form> </body> </html>
로그인 서버
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@ page import="java.sql.*" %> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> </head> <body> <% // request한 데이터가 한글일 때 깨지는 현상 방지 ( post 방식으로 보낼 경우 필요함 ) request.setCharacterEncoding("utf-8"); // 사용자가 입력한 값들 String id = request.getParameter("id"); String password = request.getParameter("password"); Class.forName("com.mysql.jdbc.Driver"); Connection conn = null; ResultSet rs = null; PreparedStatement pstmt = null; try { String jdbcDriver = "jdbc:mysql://localhost:3306/sample?serverTimezone=Asia/Seoul"; String dbUser = "root"; String dbPass = "1234"; conn = DriverManager.getConnection(jdbcDriver,dbUser,dbPass); String query = "select * from member where id = ? and password = ?"; pstmt = conn.prepareStatement(query); pstmt.setString(1,id); pstmt.setString(2,password); rs = pstmt.executeQuery(); if (rs.next()){ // select 결과가 있으면 true // session 영역의 user_id 변수에 id 값 저장. session.setAttribute("user_id" , id); // 메인페이지로 이동 response.sendRedirect("LoginForm.jsp"); } else { // 회원가입 페이지로 이동 response.sendRedirect("memberForm.jsp"); } } catch(SQLException ex){ out.println(ex); out.println("DB 연결 실패"); } finally { if(conn != null){ conn.close(); } } %>
** 로그인에 성공했다면, session에 값을 추가해줘야한다. 그래야 이후에 사용자가 로그아웃 하기 전 까지 로그인이 유지된다.
- 로그인에 성공하면 session에 id 값을 저장 할 수 있다.
- 다음과 같이 session의 값을 가져올 수도 있다.
로그인 했을 때만 권한을 주고싶을 때
- 원래의 글쓰기 페이지
- 로그인 했을 때만 글을 쓸 수 있는 조건을 줘보자
- 로그인한 상태가 아니라면 해당 행이 나타나지 않는다.
로그아웃
: session.invalidate(); 를 실행시킨다 ( 세션 초기화 )
'JSP' 카테고리의 다른 글
커넥션 풀 (0) 2023.03.27 mysql에서 데이터 가져오기 (0) 2023.03.23 프론트엔드와 백엔드 / JDBC 세팅 (0) 2023.03.23 c: 코어태그 와 fmt: 국제화 태그 (0) 2023.03.23 세션 (session) (0) 2023.03.22