Project/바디로그 (바디프로필 웹, 앱 애플리케이션)

토이프로젝트 / 바디로그 / 운동어플 / 개발일지 / 20210520

RUCKUS 2021. 5. 24. 10:00

생각지도 못한 난관에 봉착했다.

 

이미 서블릿을 통한 프로젝트로 Ajax를 너무 많이 코딩해본터라, 크게 문제가 없을 거라고 생각했고 이번에는 Ajax라이브러리 중 하나인 fetch를 사용하여 비동기통신을 해보리라 다짐하였다.

 

헌데,,,thymeleaf 템플릿을 내가 너무 얕본탓일까... 처음부터 통신에 에러가 나서...사실 오늘 하루는 이거 테스트 하느라고 시간을 다 보냈다 ㅠㅠ 이러다가 한달은 더 연장되게 생겼다.

 

여튼 fetch로 해보려고 초기에 몇가지 테스트를 진행하였으나, 진척이 없어 구글링을 해보았더니 보통 ajax + thymeleaf관련 글이 다수 존재했다. 이유가 있을 것이라는 생각에 나도 ajax로 하기로 마음먹고 구글링의 블로그들을 참조하고 있었는데... 이게 뭐야... 단순히 String값 하나만 리턴하는 형태의 예제 뿐이었다.

 

Servlet을 할 당시에는 자바 서버쪽에서의 메소드가

 

접근제한자 void 메소드명(request, response) 의 형태 였기 때문에

 

ajax의 요청 결과를 response.getWriter().append(res) 의 형태로 리턴이 가능했다.

 

근데 Spring boot 에서는

 

접근제한자 String 메소드명(Model model) 의 형태로 배웠던 터라..

리턴타입이 스트링이어야만 했다.

 

휴 그리하여 2가지 방법을 생각했는데...

 

1. 가고자하는 웹페이지 :: #id ->

   구글링해보니까 이런식으로 스트링값을 전송하는 예제를 다수 있었기에?? 근데 리스트는 안되는 것 같았다.
2. 리턴타입을 String으로 하지말기. 

  예전 jsp때처럼 void로 한다음에 response.getWriter().append()...를 써볼까 생각했는데 그럼 스프링부트 하는 의미가 없는 것 같고...

 

결국 1번을 2시간 가량 삽질한 결과 드디어 출력할 수 있게 되었다 ㅠㅠ

 

return에다가 "가고가자하는 페이지 :: #넣어줄태그의 id값"

 

의 형태로 리턴하면서 model.addAttribute("list", list); 값을 넣어 주었다.

 

그 후에 html 단에서 thymeleaf의 th:each태그를 이용해 내가 가지고 있는 값들을 넣더니 잘만 되더라...

근데 그 전까지는 th:if, th:unless 를 이용해 사이즈가 0이라면 내용이 없다를 출력하고 싶었는데,

해당 코드만 작성하면 이상하게 에러가 발생하였다... 하여 일단 해당 부분은 삭제하고 코딩하기로 한다.

 

생각보다 갈길이 너무 멀다.

그래도 통신이 성공했다는 것에 만족하고 내일은 2배 더 열심히 코딩해보자.

 

주말까지 무조건 내가 맡은 부분의 CRUD를 완성해오리라 다짐한다!