Redis - Spring Boot + Redis를 사용하여 실시간 검색어 순위 만들기 (2) Spring Redis 검색어 저장

https://hanke-r.tistory.com/entry/Redis-Spring-Boot-Redis%EB%A5%BC-%EC%82%AC%EC%9A%A9%ED%95%98%EC%97%AC-%EC%8B%A4%EC%8B%9C%EA%B0%84-%EA%B2%80%EC%83%89%EC%96%B4-%EC%88%9C%EC%9C%84-%EB%A7%8C%EB%93%A4%EA%B8%B0-1-%ED%99%94%EB%A9%B4-%EA%B5%AC%EC%84%B1-%EB%B0%8F-Script-%EC%B2%98%EB%A6%AC

Redis - Spring Boot + Redis를 사용하여 실시간 검색어 순위 만들기 (1) 화면 구성 및 Script 처리

이전 글에서 화면 구성을 완료했는데 이번 글에서는 검색어를 입력해서 검색어를 Redis에 저장하는 방법에 대해서 알아보자.

 

---

1. 검색어 입력창 추가 + Script 추가

 

1-1. HTML 수정

백단 프로세스 작업하기전에 검색어 입력창을 추가하자.

검색어를 입력하고 검색 버튼을 클릭하면 실시간 검색어 창에서 순위가 변동되게 수정할 예정이다.

<input type="text" id="search" placeholder="검색어를 입력" />
<button type="button" onclick="searchKeyword()">검색</button>

검색창 추가

 

1-1. Script 추가

Script에서는 검색어를 파라미터로 받아서 서버에 전송만 해주면 된다.

ajax를 사용해서 간단하게 구현하자.

<script src="https://code.jquery.com/jquery-3.7.1.min.js" integrity="sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo=" crossorigin="anonymous"></script>
<script>
	function searchKeyword() {
		const keyword = document.getElementById('search').value;

        const params = {
			keyword : keyword
        }

		$.ajax({
			url: "/api/v1/search",
			type: "POST",
			data: params,
			dataType: "json",
			success: function (data) {
				console.log(data);
			},
			error: function (xhr, status, error) {
				console.log(error);
			}
		});
    }
</script>

 

 

---

2. redis 에 데이터 저장

 

2-1. Redis에 데이터 저장

검색어를 받아서 Redis에 저장을 시켜보자.

 

RedisService 클래스를 하나 만들고 코드를 작성해보자.

 

Redis ZSET을 활용하여 인기 검색어를 집계하고, 24시간 동안 유지되는 일일 인기 검색어와 전체 누적 인기 검색어를 처리하는 프로세스를 만들어보자.

 

hot_keywords(하루), hoy_keyword:current(전체)로 이중 저장되어있다.

 

- RedisService.java

@Service
public class RedisService {

    @Autowired
    private RedisTemplate<String, Object> redisTemplate;

    private static final String HOT_KEYWORDS = "hot_keywords";
    private static final long TTL = 60 * 60 * 24; // 24시간

    /**
     * 검색어 집계
     */
    public void addKeyword(String keyword) {
        // 항상 점수 증가 (ZSET에 없으면 자동 생성됨)
        redisTemplate.opsForZSet().incrementScore(HOT_KEYWORDS, keyword, 1);
        redisTemplate.opsForZSet().incrementScore("hot_keywords:current", keyword, 1);

        // TTL이 없다면 새로 설정 (TTL이 만료될 수 있으므로 재확인)
        Long ttl = redisTemplate.getExpire(HOT_KEYWORDS);
        if (ttl == null || ttl == -1) {
            redisTemplate.expire(HOT_KEYWORDS, Duration.ofSeconds(TTL));
        }
    }
}

 

 

- TestController.java (/api/v1/search)

@Controller
public class TestController {

    private final RedisService redisService;

    public TestController(RedisService redisService) {
        this.redisService = redisService;
    }

    // 이전에 작성했던 View 페이지
    @GetMapping("/view/rate")
    public String rateView() {
        return "test/rate";
    }

    @PostMapping("/api/v1/search")
    public String searchKeyword(@RequestParam Map<String, Object> params, Model model) {

        redisService.addKeyword(params.get("keyword").toString());

        return "jsonView";
    }
}

 

여기까지 작업이 완료되면 검색어를 입력해보자.

hanker, hanker2, hanker3, hanker4 여러개 입력해봤다.

검색어 입력 테스트

테스트 결과

 

- 검색버튼을 누를때마다 score가 누적되는게 보이고, hot_keywords(하루), hoy_keyword:current(전체)에 저장이 잘되는 걸 확인할 수 있다.

 

다음 글에서는 저장된 내용을 가지고 실시간 검색어 순위를 변동시켜보자!