게시글 조회(상세조회,view page)
by 볼빵빵오춘기board2list.html
<td><a th:href="@{|/board2/${board.id}|}" th:text="${board.boardTitle}"></a></td>
<td><a th:href="@{/board2/${board.id}}" th:text="${board.boardTitle}"></a></td>
Board2Controller
- 상세페이지에 누군가 url을 타고 넘어오면 조회수가 +1이 되야한다.
- id값에 맞는 해당 컬럼을 조회해서 가져온다.
@GetMapping("/{id}")
public String findById(@PathVariable Long id, Model model){
/*
해당 게시글의 조회수를 하나 올리고
게시글 데이터를 가져와서 board2detail.html에 출력
*/
board2Service.updateHits(id);
Board2DTO board2DTO = board2Service.findById(id);
model.addAttribute("board",board2DTO);
return "board2detail";
}
Board2Service
@Transactional : JPA에서 제공하는 일반 쿼리가 아닌 내가 직접 쿼리를 작성시에 붙여줘야 해당 쿼리를 뭔지 찾아낸다.
@Transactional
public void updateHits(Long id) {
board2Repository.updateHits(id);
}
Board2Repository
DB 쿼리를 작성하면 update board_table set board_hits=board_hits+1 where id=? 작성하면 된다. JPA에서 별도의 쿼리가 필요한 상태이므로 @Query 어노테이션을 사용한다.
더보기
@Query 를 작성 방법 2가지
1. Entity 기준
일반 쿼리에서 table명이 들어가는 부분에 Entity를 써주면 되고 아래 b 와 같이 약어를 쓰는게 필수
그리고 조건에 b.id=?하고 들어가는 :id값은 @Param()에 매칭이 된다.
@Modifying
@Query(value = "update Board2Entity b set b.boardHits=b.boardHits+1 where b.id=:id")
void updateHits(@Param("id") Long id);
2. 실제 db기준
실제 사용할려면 table명을 적어주면되고, value옆에 속성으로 nativeQuery = true 속성을 넣어주면된다.
⇒ 그리고 위와같이 쓸 때는 @Modifying를 붙여줘야한다.
@Modifying
@Query(value = "update Board2Entity b set b.boardHits=b.boardHits+1 where b.id=:id")
void updateHits(@Param("id") Long id);
Board2Service
public Board2DTO findById(Long id) {
Optional<Board2Entity> optionalBoard2Entity = board2Repository.findById(id);
if(optionalBoard2Entity.isPresent()){
Board2Entity board2Entity = optionalBoard2Entity.get();
Board2DTO board2DTO = Board2DTO.toBoard2DTO(board2Entity);
return board2DTO;
}else{
return null;
}
}
board2detail.html
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>detail</title>
<!-- jquery cdn -->
<script src="https://code.jquery.com/jquery-3.6.3.min.js" integrity="sha256-pvPw+upLPUjgMXY0G+8O0xUf+/Im1MZjXxxgOcBQBXU=" crossorigin="anonymous"></script>
</head>
<body>
<table>
<tr>
<th>id</th>
<td th:text="${board.id}"></td>
</tr>
<tr>
<th>title</th>
<td th:text="${board.boardTitle}"></td>
</tr>
<tr>
<th>writer</th>
<td th:text="${board.boardWriter}"></td>
</tr>
<tr>
<th>date</th>
<td th:text="${board.boardCreatedTime}"></td>
</tr>
<tr>
<th>hits</th>
<td th:text="${board.boardHits}"></td>
</tr>
<tr>
<th>contents</th>
<td th:text="${board.boardContents}"></td>
</tr>
</table>
<button onclick="listReq()">목록</button>
<button onclick="updateReq()">수정</button>
<button onclick="deleteReq()">삭제</button>
</body>
<script th:inline="javascript">
const listReq = () => {
console.log("목록 요청");
const page = [[${page}]];
location.href = "/board2/";
}
const updateReq = () => {
console.log("수정 요청");
const id = [[${board.id}]];
location.href = "/board2/update/" + id;
}
const deleteReq = () => {
console.log("삭제 요청");
const id = [[${board.id}]];
location.href = "/board2/delete/" + id;
}
</script>
</html>
블로그의 정보
Hello 춘기's world
볼빵빵오춘기