상품 상세의 전반적인 흐름은 아래와 같습니다.

list.html 페이지에서 http://localhost/detail/상품코드 형식으로 만들어진 하이퍼링크를 클릭합니다.

상품코드가 Controller 에 전달됩니다.  repository  에서 sql 명령어를 생성하고 실행하여 상품코드에 해당하는 1개의 레코드를 Controller에 되돌려줍니다.

Controller는 그 자료를 저장하여 detail.html 페이지에 보내 출력시킵니다.

[해설]

상품정보를 클릭하면 상세페이지로 이동하기 위하여 하이퍼링크를 걸었습니다.

하이퍼링크 태그의 형식은 아래와 같습니다.

th:href="@{/detail/}+${row.productCode}"

@{} 안에는 고정적인 url pattern을 작성합니다.  ${row.productCode}는 상품코드입니다.

상품코드가 1번이라면 http://localhost/detail/1 로 url이 구성됩니다.

아래는 컨트롤러의 detail() 함수 부분입니다.

@GetMapping("detail/{productCode}")
 

하이퍼링크를 클릭하여 이동하는 방식은 get 방식이므로 @GetMapping을 사용했습니다.

상세화면을 보기 위한 url의 형식을 아래와 같이 만들었습니다.

http://localhost/detail/{상품코드}

상품코드가 1번이라면 http://localhost/detail/1 이 됩니다.
상품코드는 클릭할 때마다 바뀌므로 변수로 처리해야 합니다. 

public ModelAndView detail(@PathVariable long productCode, ModelAndView mav) {
 

이 변수는 url에 포함되는 변수이므로 @PathVariable 어노테이션을 붙여서 값을 전달했습니다.

mav.setViewName("detail");
 

출력 페이지를 detail.html로 지정합니다.

Optional<Product> opt = productRepository.findById(productCode);

Product dto = opt.get();

repository에서 sql 명령어를 실행하여 해당하는 레코드를 조회합니다.  그런데 상품코드에 해당하는 상품이 조회가 안될 수도 있습니다.  레코드가 존재하지 않을 경우 NullPointerException 이 발생하므로 Optional을 이용하여 처리하게 됩니다.

mav.addObject("dto", dto);
 

변수명을 dto로 하고 상품코드에 해당하는 레코드를 dao에 요청합니다.

[실행 결과]

상품목록에서 상품정보 링크를 클릭하면 해당되는 상품의 상세 정보를 출력합니다.