해결된 질문
작성
·
59
·
수정됨
0
=========================================
[질문 템플릿]
1. 강의 내용과 관련된 질문인가요? (예/아니오)
2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오)
3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오)
[질문 내용]
안녕하세요. 가르쳐 주지 안으셔서 질문을 드립니다.
자바 스크립트 코드에서
<script>
나머지 내용 생략....
//객체 var user = [[${user}]];
</script>
객체 코드 오류를 없애는 법을 나중에 설명해준다고 하였는데요.(5:27-5:38)
2번을 들어봤지만. 나오는 이야기가 없어서 요청을 합니다.
가르쳐 주시면 감사하겠습니다.
이렇게 요청을 한 이유는 영한님이 가르쳐 준다고 하였고, 자바 스크립트에서 이렇게 하신 이유가 있다고 생각해서 배워야 겠다는 생각이 들어서요.
답변 1
0
안녕하세요, 인프런 AI 인턴입니다. 생각하는자님.
질문하신 내용은 자바스크립트 코드에서 스프링 MVC로 전달된 객체를 사용하고자 할 때 발생하는 문제 같네요.
이와 관련해서 FAQ에는 관련 내용이 발견되지 않아서 다른 해결책을 제시해 보겠습니다.
우선, 템플릿 엔진에서 제공하는 변수 바인딩 방식에서 문제가 발생할 수 있습니다. 자바스크립트는 보통 HTML이 브라우저에 렌더링될 때 실행되기 때문에, 서버에서 전달된 데이터와 자바스크립트 간의 값 처리에 주의가 필요합니다.
[[${user}]]
형태로 스프링에서 데이터를 JSP나 Thymeleaf 템플릿으로 전달받는 경우, 자바스크립트 내부에서 이를 JSON 형식으로 변환하여 사용하는 것이 일반적입니다.
JSON 변환 예제:
<script>
// JSON.stringify를 사용하여 자바스크립트 객체로 변환
var user = JSON.parse('[[${userJson}]]');
</script>
이와같이 하여 JSON 형식으로 서버 데이터를 받아야 크롬 콘솔 등에서 직접 변수를 확인하고 사용하는데 용이합니다.
데이터가 제대로 파싱되지 않아 발생하는 오류는 브라우저 콘솔에서 자주 확인되므로 데이블 로그가 문제가 있다면 이를 참고하시면 도움이 됩니다.
저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.
현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏
추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.
JSON.parse()
JSON 객체의 parse() 메소드는 JSON 형식의 문자열을 Json 객체로 변환시킨다.
JSON.stringify()
JSON 객체의 stringify() 메소드는 Json 객체를 String 객체로 변환 시켜준다.
JSON.parse('[[${userJson}]]'); 이건 오류가 생기고,
JSON.stringify('[[${userJson}]]') 이건 되네요.
근데 이유를 모르겟네요. 가르쳐 주실분을 구합니다.