반응형
2022.04.28 - [Practice] - JSP로 반응형 게시판 만들기 [4]
JSP로 반응형 게시판 만들기 [4]
2022.04.28 - [Practice] - JSP로 게시판 만들기 [3] JSP로 게시판 만들기 [3] 2022.04.27 - [Practice] - JSP로 반응형 게시판 만들기 [2] JSP로 반응형 게시판 만들기 [2] 저번 포스팅 다음 글입니다!! 2022.04...
puenti.tistory.com
이번에 포스팅에서는 게시판의 여러 기능 중 글쓰기 기능 먼저 만들어보도록 할께요!!
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ page import = "java.io.PrintWriter"%> <!-- 스크립트 문장을 실행 할 수 있게 해주자 -->
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset = UTF-8">
<meta name = "viewport" content="width=device-width", initial-scale="1">
<!-- 부트스트랩은 컴퓨터, 모바일 어떤걸로 접속하더라도 해상도에 맞게 디자인을 보여주는 템플릿. 그래서 반응형 웹에 사용되는 메타 태그를 적어준다 -->
<link rel="stylesheet" href="css/bootstrap.css"> <!-- 디자인을 담당하는 css 참조 완료 -->
<title>JSP 게시판 웹사이트</title>
</head>
<body>
<% /* 로그인이 된 사람들은 로그인 정보를 담을 수 있게 해주자 */
String userID = null;
if (session.getAttribute("userID") != null) {
userID = (String) session.getAttribute("userID");
}
// 현재 세션이 존재하는 사람이라면 그 아이디값을 그대로 받아서 관리할 수 있게 해줌
%>
<nav class="navbar navbar-default">
<div class = "navbar-header">
<button type = "button" class="navbar-toggle collapsed"
data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"
aria-expanded="false">
<!-- 아이콘바 3개 -->
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class = "navbar-brand" href="main.jsp">JSP 웹 사이트</a>
</div>
<div class="collapse navbar-collapse" id = "bs-example-navbar-collapse-1">
<ul class = "nav navbar-nav">
<li><a href="main.jsp">메인</a></li>
<li class = "active"><a href="bbs.jsp">게시판</a></li>
</ul>
<%
// 접속하기는 로그인이 안될 경우만 보이게
if(userID == null) {
%>
<ul class ="nav navbar-nav navbar-right">
<li class = "dropdown">
<a href="#" class = "dropdown-toggle"
data-toggle="dropdown" role="button" aria-haspopup="true"
aria-expanded="false">접속하기<span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="login.jsp">로그인</a></li>
<li><a href="join.jsp">회원가입</a></li>
<!-- 경로와 오타가 없음에도 a 링크 실행이 안됨 -->
</ul>
</li>
</ul>
<%
} else { //로그인 한 사람들이 보이는 화면
%>
<ul class ="nav navbar-nav navbar-right">
<li class = "dropdown">
<a href="#" class = "dropdown-toggle"
data-toggle="dropdown" role="button" aria-haspopup="true"
aria-expanded="false">회원관리<span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href = "logoutAction.jsp">로그아웃</a></li>
</ul>
</li>
</ul>
<%
}
%>
</div>
</nav>
<!-- 네비게이션 구동, 하나의 웹사이트에서 전반적인 구성을 보여주는 역할 -->
<div class = "container">
<div class="row">
<form method="post" action="writeAction.jsp">
<table class = "table table-striped" style="text-align: center; boerder: 1px solid #dddddd">
<!-- class = "table table-striped"는 게시판 목록들이 짝수와 홀수 번갈아가면서 색이 변하게해줌 -->
<thead>
<tr>
<th colspan ="2" style="background-color: #eeeeee; text-align: center;">게시판 글쓰기 양식</th>
</tr>
</thead>
<tbody>
<tr>
<td><input type = "text" class="form-control" placeholder="글 제목" name="bbsTitle" maxlength="50"></td>
<!-- input 타입은 특정한 정보를 Action 페이지에 보낼때 필요 -->
</tr>
<tr>
<td><textarea class="form-control" placeholder="글 내용" name="bbsContent" maxlength="2048" style="height: 350px;"></textarea></td>
</tr>
</tbody>
<!-- Action 페이지로 보낼 수 있음 -->
</table>
<input type="submit" class="btn btn-primary pull-right" value = "글쓰기">
</form>
</div>
</div>
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<!-- 제이쿼리를 가져오기 -->
<script src="js/bootstrap.js"></script>
<!-- 부트스트랩에서 기본적으로 참조 -->
</body>
</html>
게시판 페이지예요!!
글쓰기를 누르니 writeAction 페이지로도 넘어갈 수 있는거까지 확인했습니다!
이제 데이터베이스를 접근 할 수 있게 BbsDAO 페이지를 만들어 보겠습니다!
package user;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
// CMD shift O 를 눌러서 외부라이브러리 추가해주기!!
public class UserDAO {
private Connection conn;
private PreparedStatement pstmt;
private ResultSet rs;
// 생성자 생성
public UserDAO() {
try {
String dbURL = "jdbc:mysql://localhost:3306/BBS";
String dbID = "root";
String dbPassword = "12qwaszx";
Class.forName("com.mysql.jdbc.Driver"); // mysql에 접속할 수 있게 해주는 매개체 역할을 해준다
conn = DriverManager.getConnection(dbURL, dbID, dbPassword);
// conn 객체 안에 접속된 정보가 담긴다
} catch(Exception e) {
e.printStackTrace();
}
}
// 이 부분까지 mysql에 접속하게 해주는 단계
// 로그인 기능에 대한 구현
public int login(String userID, String userPassword) {
// SQL에 넣을 명령어 적어주기
String SQL = "SELECT userPassword FROM USER WHERE userID = ?"; // ? 안에는 입력받은 userID가 들어간다
try {
pstmt = conn.prepareStatement(SQL);
pstmt.setString(1, userID);
rs = pstmt.executeQuery();
if (rs.next()) {
if(rs.getString(1).equals(userPassword))
return 1; // 로그인 성공
else
return 0; // 비밀번호 불일치
}
return -1; // 아이디가 없음
} catch(Exception e) {
e.printStackTrace();
}
return -2; // 데이터베이스 오류
}
public int join(User user) {
String SQL = "INSERT INTO USER VALUES(?, ?, ?, ?, ?)";
try {
pstmt = conn.prepareStatement(SQL);
pstmt.setString(1, user.getUserID());
pstmt.setString(2, user.getUserPassword());
pstmt.setString(3, user.getUserName());
pstmt.setString(4, user.getUserGender());
pstmt.setString(5, user.getUserEmail());
// ?에 각각의 해당 변수들을 채워넣어준다!!
return pstmt.executeUpdate();
//INSERT 문장을 실행한 경우는 반드시 0이상의 숫자가 발현된다!!
// 따라서 -1 의 값이 나오지 않으면 성공적으로 값이 들어간 것!!
} catch(Exception e) {
e.printStackTrace();
}
return -1; // 데이터베이스 오류
}
}
BbsDAO 페이지에 3가지 함수를 구현해주고
이제 글을 작성해주는 writeAction 페이지를 만들어볼께요!!
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ page import = "bbs.BbsDAO" %> <!--우리가 만든 클래스를 사용해주기 위해-->
<%@ page import = "java.io.PrintWriter" %> <!-- JS 문장을 작성하기 위해 -->
<% request.setCharacterEncoding("UTF-8"); %>
<jsp:useBean id = "bbs" class="bbs.Bbs" scope="page" />
<jsp:setProperty name="bbs" property="bbsTitle" /> <!-- -->
<jsp:setProperty name="bbs" property="bbsContent" />
<!-- 보내준 5가지 데이터 값을 받아야한다 -->
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset = UTF-8">
<title>JSP 게시판 웹사이트</title>
</head>
<body>
<%
String userID = null;
if(session.getAttribute("userID") != null){
userID = (String) session.getAttribute("userID");
} // 세션이 존재하는 아이디들은 세션ID값을 받게 해주자
if (userID != null){
PrintWriter script = response.getWriter();
script.println("<script>");
script.println("alert('로그인을 하세요')");
script.println("location.href = 'login.jsp'"); // 로그인이 안된 사람은 로그인페이지로 가게한다
script.println("</script>");
}
else {
if(bbs.getBbsTitle() == null || bbs.getBbsContent() == null) {
/* 만약 입력안된 사항이 있다면 돌려보내주자*/
PrintWriter script = response.getWriter();
script.println("<script>");
script.println("alert('입력이 안 된 사항이 있습니다')");
script.println("history.back()"); // 이전 화면으로 돌아간다
script.println("</script>");
/* 받아야 하는 값들이 비워져 있을 경우의 수를 적어준다 */
// 하나라도 입력이 안된 경우 이전 페이지로 돌아감
}
else {
BbsDAO bbsDAO = new BbsDAO();
int result = bbsDAO.write(bbs.getBbsTitle(), userID, bbs.getBbsContent());
if (result == -1){ // 리턴값이 -1이면 데이터 오류가 발생한 경우니
PrintWriter script = response.getWriter();
script.println("<script>");
script.println("alert('글쓰기에 실패했습니다')");
script.println("history.back()");
script.println("</script>");
} // 중복된 아이디가 있으면 이전 페이지로 돌아감
else {
PrintWriter script = response.getWriter();
script.println("<script>");
script.println("location.href = 'bbs.jsp'");
script.println("</script>");
}
}
}
%>
</body>
</html>
writeAction 페이지는 이렇게 만들어볼 수 있어요!
입력했을 경우 글쓰기가 잘 수행되는걸 확인할 수 있어요!
아직 글목록을 보여주는 부분은 작업하지 않아서 예시 디자인데이터만 나오는걸 확인할 수 있어요!!
실제로도 해당 데이터가 데이터베이스 안에 들어가 있는걸 확인 할 수 있어요!!
그러니 글쓰기 기능이 정상적으로 작동할 수 있다고 볼 수 있어요!!
다음 포스팅은 작성한 글들을 데이터베이스에 가져와서 리스트에 보여질 수 있는거까지 구현해보도록 할께요!!
반응형
'Practice' 카테고리의 다른 글
JSP로 반응형 게시판 만들기[7/9], 게시판 삭제, 수정 기능 삽입 (0) | 2022.04.29 |
---|---|
JSP로 반응형 게시판 만들기[6/9], 게시판 보기, 목록 기능 구현하기 (0) | 2022.04.28 |
JSP로 반응형 게시판 만들기 [4/9], DB 구축, 게시판 기능 구현 (0) | 2022.04.28 |
JSP로 반응형 게시판 만들기 [3/9], 로그인 회원가입 페이지 만들기, 세션 설정 (0) | 2022.04.28 |
JSP로 반응형 게시판 만들기 [2/9], 회원가입 양식 만들기 (0) | 2022.04.27 |