[JPA + SpringSecurity 게시판] #11 JPA 검색 만들기

 

 

짝짝짝 👏

이전글에서 Pageable을 이용한 페이징까지 완성 🥑

이번엔 JPA Repository에 %Like% 효과의 검색을 추가하고

검색 결과 또한 Pageable 페이징된 리스트를 구현해보자

 

 

---

 

코딩시작 👩🏻‍💻

기존 class에 아래 코드를 수정, 추가

 

 

 

 

 

1. BoardRepository

 

%Like%

DB data 중 제목 또는 내용에 포함된 키워드를 찾아내는 쿼리 메소드() 추가

 

[ Repository ]

public interface BoardRepository extends JpaRepository<Board, Long> {

    // 검색
    Page<Board> findByTitleContainingOrContentContaining (String title,String content, Pageable pageable);
}

 

✅ Pageable

• JPA Repository를 상속하여 Pageable 이용

• JPA의 반환타입중 하나
  • List<Board>가 아닌 Page<Board>로 받음
    • 1,2,3페이지처럼 페이지 당 글 갯수를 정하면 페이지를 나누어 반환해줌
    • 위 사진은 bootstrap까지 결합한 것 (아래 설명)

• 이는 Entity라서 직접 사용할 수 없으므로 Dto로 변환

 

• Slice<T> 는 스크롤 타입(인스타 등)

 

 

✅ findByTitleContainingOrContentContaining

• ‘ By ‘ 를 기준으로 Where절에 대응

• Containing : %Like% 의 효과. 검색 키워드 포함 여부 조회

• Or : 앞 조건 or 뒤 조건 중 하나라도 부합하면 true

• Title , Content : 필드. 제목과 내용 중 검색 키워드가 포함될 것

 

✅ ( String title, String content, Pageable pageable )

• 파라미터로 title, content 그리고 검색 결과물 페이징을 위해 pageable 받는다

 

 

---

 

 

 

 

2. BoardService

 

✅ 페이징 구현을 위해 List 메소드() 수정

 

[ BoardService ]

- 글 검색 searchPosts 추가

@Transactional
public List<Board> searchPosts(String title, String content, Pageable pageable) {
    Page<Board> boards = boardRepository.findByTitleContainingOrContentContaining(title, content, pageable);
    List<Board> boardList = new ArrayList<>();

    if (boards.isEmpty()) return boardList ;

    for (Board board : boards ) {
        boardList.add(board);
    }
    return boardList;
}

 

✅ Page<Board>

• JPA Repository를 상속하여 Pageable 이용 ( 위 Repository 설명 참고 )

 

 

---

 

3. Controller

 

 

 

List와 동일하게 검색 결과 List 또한

Controller의 파라미터에 Pageable객체 설정

그리고 @RequestParam(value=”keyword”)로 검색어를 받는다

 

검색 keyword와 페이징 Pageable 쿼리 파라미터를 넣어 실행

• http://localhost:8088/search/?keyword=검색어&page=0

 

나머지는 일반 List와 동일!

 

 

[ BoardController ] - “/search” 매핑 추가

// 글 검색
    @GetMapping("/search")
    public String search(@RequestParam(value = "keyword") String keyword,
                         @PageableDefault(page = 0, size = 5, sort = "id", direction = Sort.Direction.DESC)
                                 Pageable pageable, Model model) {

        Page<Board> boards = boardRepository.findByTitleContainingOrContentContaining(keyword,keyword,pageable);
        List<Board> boardList = boardService.searchPosts(keyword,keyword, pageable);

        int nowPage = boards.getPageable().getPageNumber()+1;
        int startPage = Math.max(nowPage-4,1);
        int endPage = Math.min(nowPage+5, boards.getTotalPages());
        int totalPages = boards.getTotalPages();

        model.addAttribute("keyword", keyword);
        model.addAttribute("boardList", boardList);
        model.addAttribute("nowPage", nowPage);
        model.addAttribute("startPage", startPage);
        model.addAttribute("endPage", endPage);
        model.addAttribute("totalPages", totalPages);

        return "board/list";
    }

 

✅ Pageable 설정은 List와 동일하니 생략

• http://localhost:8088/search/?keyword=”검색어”&page=0

 

✅ @RequestParam(value = "keyword") String keyword,

• 클라이언트의 요청으로 넘겨받은 파라미터 “keyword”를

• String keyword로 사용

• 앞으로 keyword 값을 이용해 제목 또는 내용에 %Like% 조회

 

✅findByTitleContainingOrContentContaining (keyword, keyword, pageable);

• 앞서 BoardRepository에서 생성한 쿼리 메소드()
• keyword가 제목 또는 내용에 포함되어있는지 확인

 

BoardRepository에 (String title, String content, Pageable pageable)로 등록했다

 

 

@RequestParam으로 찾을 keyword값만 받고

String 타입인 keyword를 제목과 내용 모두에서 %LIKE% 검색

 

• findByTitleContainingOrContentContaining (keyword, keyword, pageable);

 

 

 

 

---

 

 

4. header.html

 

[ header.html ]

- 리스트</ul> 아래 추가

<!-- 검색 form -->
<form class="form-inline my-2 my-lg-0" action="/search" method="GET">
    <div class="input-group">
        <input name="keyword" class="form-control mr-sm-2" type="text" placeholder="검색어를 입력해주세요">
        <span class="input-group-btn" >
	        <button class="btn btn-outline-light my-2 my-sm-0" >Search</button>
        </span>
    </div>
</form>

 

 

✅ Bootstrap 의 < form-inline >

<input-group> <form-control> <input-group-btn> 을 적절히 사용하면

Bootstrap에서 제공하는 검색 툴이 그려진다

많은 방식이 있는데 난 앞선 메뉴들과 통일감 있게 하려고 위처럼 적용했다

 

 

 

 

🙊

WoW! 완성

 

 

페이징 어려웠는데 해결했으니까

검색 결과물 페이징?! 쉽게 생각했는데

에러가 많이 떠서 고생했다 🥲다

 

다음편에서는 SpringSecurity 기능을 추가해보잣!!