묻고 답해요
156만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결코드로 배우는 React 19 with 스프링부트 API서버
질문입니다.
안녕하세요, 강의 잘 수강하고 있습니다다만 강의랑 자료랑 달라서 물어보고 싶어서 글을 남깁니다. 1.ch3 압축파일에 강의와는 다르게 압축파일에는 search 클래스가 없습니다. ch4 알집파일 todo.d.ts파일에 아래와 같이 writer를 추가하는 게 맞는 건지 궁금합니다.interface TodoModify { tno: number, title: string, writer: string dueDate: string | null, complete: boolean }
-
미해결코드로 배우는 React 19 with 스프링부트 API서버
3장 Querydsl 검색처리 수업따라하다가 에러가 나요..
TodoServiceImpl.java 작성중에 중간에 소스가 갑자기 바뀌었는데요.그리고 아래와 같이 작성하셔서 따라 작성하였는데요.PageResponseDTO<TodoDto> responseDTO = PageResponseDTO.<TodoDto>withAll() .dtoList(dtoList) .pageRequestDTO(pageRequestDTO) .totalCount(result.getTotalElements()) .build();뭘 놓친건지... 위와 같이 에러 나서 진행이 안돼요. 카페 들어가서 해당 강의 소스도 찾아봤는데수업하신 내용이랑 조금 다르게 되어있긴 하지만 사용법에는 큰 차이는 없어 보이거든요 ㅠlombok도 많이 안써봐서... 잘 모르겠어요..
-
미해결코드로 배우는 React 19 with 스프링부트 API서버
JWTUtil 에 심각한 버그 존재?
안녕하세요.최초 10분이 지난 후 refreshToken 정보를 이용하여, new accessToken 을 발급받는 것을 적용한 이후에는 오랜 시간이 지나도 다시 new accessToken 발급을 하지 않는 현상이 있더군요.의문을 가지다가 Redis 에 연동하고, ttl JWT:ACCESS:user8@aaa.com 로 accessToken의 남은 시간을 체크해보니 문제가 있다는 걸 확인했습니다.chatGPT 로 점검해서 아래와 같은 코드로 수정한 이후 정상 동작하는 거 같습니다.public static String generateToken(Map<String, Object> valueMap, int min) { SecretKey key = null; try { key = Keys.hmacShaKeyFor(JWTUtil.key.getBytes("UTF-8")); } catch (Exception e) { throw new RuntimeException(e.getMessage()); } // 1. claims 복사 및 exp/iat 제거 Map<String, Object> claims = new HashMap<>(valueMap); claims.remove("exp"); claims.remove("iat"); // 2. 발급시간/만료시간 생성 Date now = Date.from(ZonedDateTime.now().toInstant()); Date exp = Date.from(ZonedDateTime.now().plusMinutes(min).toInstant()); // 3. JWT 생성 return Jwts.builder().header() .add("typ", "JWT") .add("alg", "HS256") .and() .issuedAt(now) .expiration(exp) .claims(claims) .signWith(key) .compact(); }
-
미해결코드로 배우는 React 19 with 스프링부트 API서버
질문있습니다.
안녕하세요,기존 JS기반 강의의 자료는 받을 수 없는 걸까요?유투브로 올려주시긴 했으나코드를 보면서 진행해보고 싶습니다...
-
미해결코드로 배우는 React 19 with 스프링부트 API서버
스프링부트 부분은 리뉴얼되진 않은건가요?
안녕하세요. 강의가 리뉴얼 되었다고 해서 다시 보고있습니다. 리뉴얼 해주셔서 감사합니다. 혹시 리액트 부분만 리뉴얼 되고 스프링부트 부분은 리뉴얼 된 부분이 없는건가요? 감사합니다.
-
미해결코드로 배우는 React 19 with 스프링부트 API서버
조회기능시 backend 통신 실패
백앤드 cors 설정하고, 화면에서 호출하면 쿼리는 찍히는거 확인되는데, front로 값이 못들어오고 화면 콘솔에는 cors 오류가 뜨네요 ㅜ1) 백엔드 쿼리가 찍혔다면 백앤드쪽 cors 설정 된거 아닌가요?2) 클라이언트로 값이 못들어오고 있습니다. front에서 별도 cors설정이 있어야하는지 문의드려요 gpt한테 물어봐서 withCredentials 설정은 했습니다. 스크린샷 첨부합니다
-
해결됨코드로 배우는 React 19 with 스프링부트 API서버
6분23초 MainPage 코드와 자료 코드 불일치 관련 문
안녕하세요, 강사님.React Router 설정 강의 중 6분 23초에 사용하신 MainPage 코드와 강의 자료에 제공된 MainPage 코드의 작성 방식이 서로 달라서 문의드립니다.영상에서는 함수 선언식(function MainPage …)을, 자료에서는 화살표 함수(const MainPage = …) 형태로 소개되어 다소 혼란이 있습니다. 혹시 두 방식 중 특별히 권장하시는 것이 있는지, 아니면 단순히 문법 스타일 차이인지 알고 싶습니다 .또한, React나 Spring Boot의 버전 차이에 따라 코드 작성 방식이 달라지는 부분이 있는지도 궁금합니다.앞으로는 강의 영상 기준의 코드를 우선 따라 작성해도 괜찮을지 안내해 주시면 감사하겠습니다.바쁘신 와중에 읽어주셔서 감사합니다.답변 기다리겠습니다.감사합니다.
-
미해결코드로 배우는 React 19 with 스프링부트 API서버
tailwind css 오류
postcss.config.js는 설정할 필요 없나요?
-
미해결코드로 배우는 React 19 with 스프링부트 API서버
tailwind css 오류
'tailwind'은(는) 내부 또는 외부 명령, 실행할 수 있는 프로그램, 또는배치 파일이 아닙니다.떠서 수동으로 tailwind.config.js 파일 추가하고 index.css랑 기타 설정하고 실행했더니 ERROR in ./src/App.css (./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].oneOf[5].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].oneOf[5].use[2]!./node_modules/source-map-loader/dist/cjs.js!./src/App.css)Module build failed (from ./node_modules/postcss-loader/dist/cjs.js): Error: It looks like you're trying to use tailwindcss directly as a PostCSS plugin. The PostCSS plugin has moved to a separate package, so to continue using Tailwind CSS with PostCSS you'll need to install @tailwindcss/postcss and update your PostCSS configuration. at Le (C:\react\react_springboot\node_modules\tailwindcss\dist\lib.js:36:1984) at LazyResult.runOnRoot (C:\react\react_springboot\node_modules\postcss\lib\lazy-result.js:361:16) at LazyResult.runAsync (C:\react\react_springboot\node_modules\postcss\lib\lazy-result.js:290:26) at LazyResult.async (C:\react\react_springboot\node_modules\postcss\lib\lazy-result.js:192:30) at LazyResult.then (C:\react\react_springboot\node_modules\postcss\lib\lazy-result.js:436:17)ERROR in ./src/index.css (./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].oneOf[5].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].oneOf[5].use[2]!./node_modules/source-map-loader/dist/cjs.js!./src/index.css)Module build failed (from ./node_modules/postcss-loader/dist/cjs.js): Error: It looks like you're trying to use tailwindcss directly as a PostCSS plugin. The PostCSS plugin has moved to a separate package, so to continue using Tailwind CSS with PostCSS you'll need to install @tailwindcss/postcss and update your PostCSS configuration. at Le (C:\react\react_springboot\node_modules\tailwindcss\dist\lib.js:36:1984) at LazyResult.runOnRoot (C:\react\react_springboot\node_modules\postcss\lib\lazy-result.js:361:16) at LazyResult.runAsync (C:\react\react_springboot\node_modules\postcss\lib\lazy-result.js:290:26) at LazyResult.async (C:\react\react_springboot\node_modules\postcss\lib\lazy-result.js:192:30) at LazyResult.then (C:\react\react_springboot\node_modules\postcss\lib\lazy-result.js:436:17)위 오류가 뜨네요 ㅜ
-
해결됨코드로 배우는 React 19 with 스프링부트 API서버
목록처리(2)에서 페이지 넘버 버튼을 누르면 표시되는 목록이 10개로 안 나옵니다
위 사진들과 같이 각 페이지에 항목이 10개씩 표시되어야 하는데 페이지 버튼의 숫자대로 표시되고 있습니다.ListConponent.js쪽이 이상한가 싶어서 찾아봐도 뭐가 문제인지 모르겠습니다.혹시 참고 자료 필요하신 게 있으시다면 말씀 부탁드리겠습니다.
-
미해결코드로 배우는 React 19 with 스프링부트 API서버
업로드 파일 보여주기(교재 191~199) 관련 질문
위 그림은 교재 195페이지 내용입니다.localhost:8080으로는 교재의 내용대로 잘 실행이 되었습니다.그래서, 지금은 aws beanstalk에서(localhost:8080이 아니 aws 서버)에서 윗 부분을 실행 시켜볼려고 하니, 3가지에 부딪혔는데...당장 내 서버(aws서버)의 upload폴더는 어디에서 볼 수 있으며,어떻게 upload 폴더에 aaa.jpg를 올리며,'localhost:8080/api/products/view/aaa.jpg 대신에 "beanstalk도메인/api/products/view/내파일이름"으로 위의 사진 처럼 실행시킬 수 있는지위 3가지에 대해서 정중히 질문드립니다.(수정 추가) 지금 aws RDS 의 CRUD는 원활히 이루어지고 있습니다.
-
미해결코드로 배우는 React 19 with 스프링부트 API서버
querydsl QTodo관련 문의
안녕하세요. 강의를 듣다가 QTodo 사용하는 시점에서 문제가 발생하여 문의드립니다. gradle 빌드시점에 QTodo 클래스를 생성하는 것 까진 확인을 하였는데 search1 메소드에서 QTodo를 사용하려고 하니 클래스 인식 자체를 못하고 있습니다.(import도 안됨) 강의 내용상으로 봤을 때 build 디렉토리에서 인위적으로 복사한 것 같진 않은데 해당 클래스를 어떻게 import해서 사용해야 할지 몰라서 문의드립니다. springboot 버전은 3.3.10입니다.
-
해결됨코드로 배우는 React 19 with 스프링부트 API서버
todo list 검색 기능 문의
todo list 에서 검색어를 입력하여 검색된 결과를 화면에 출력하려면 어떻게 구현해야 하는지요?예제에는 이런 것이 없는 거 같은데 제가 대충봐서 잘못 이해하고 있는 건가요?전체적인 흐름으로 설명해주시면 감사하겠습니다.
-
미해결코드로 배우는 React 19 with 스프링부트 API서버
JWT와 @PreAuthorize 사용하기에서 권한오류
동영상 강의에 있는 내용대로 ProductController에서 @GetMapping("/list")에 @PreAuthorize("hasAnyRole('ROLE_USER','ROLE_ADMIN')")를 작성하고나서 postman에 login 후 accessToken을 가져와서 get방식으로 토큰을 넣어서 입력하면 status : 500, "error": Interner Server Error가 뜹니다.. @PreAuthorize부분을 주석처리하고 실행해보면 list값이 잘 나오네요.. 어디부분이 잘못 된걸까요?? 참고로 CustomSecurityConfig클래스에 @EnableMethodSecurity추가도 했습니다.@PreAuthorize("hasAnyRole('ROLE_USER','ROLE_ADMIN')") @GetMapping("/list") public PageResponseDTO<ProductDTO> list(PageRequestDTO pageRequestDTO){ return productService.getList(pageRequestDTO); } 여기가 ProductController 클래스 package org.zerock.apiserver.security.filter; import com.google.gson.Gson; import jakarta.servlet.FilterChain; import jakarta.servlet.ServletException; import jakarta.servlet.http.HttpServletRequest; import jakarta.servlet.http.HttpServletResponse; import lombok.extern.log4j.Log4j2; import org.springframework.security.authentication.UsernamePasswordAuthenticationToken; import org.springframework.security.core.context.SecurityContextHolder; import org.springframework.web.filter.OncePerRequestFilter; import org.zerock.apiserver.dto.MemberDTO; import org.zerock.apiserver.util.JWTUtil; import java.io.IOException; import java.io.PrintWriter; import java.util.List; import java.util.Map; @Log4j2 public class JWTCheckFilter extends OncePerRequestFilter { @Override protected boolean shouldNotFilter(HttpServletRequest request) throws ServletException { //true == not check String path = request.getRequestURI(); log.info("------check uri---------"+path); if(path.startsWith("/api/member/")){ return true; } //false == check return false; } @Override protected void doFilterInternal(HttpServletRequest request, HttpServletResponse response, FilterChain filterChain) throws ServletException, IOException { log.info("----------------------"); log.info("----------------------"); log.info("----------------------"); String autoHeaderStr = request.getHeader("Authorization"); //bearer // 7개 후 JWT 문자열 try { String accessToken = autoHeaderStr.substring(7); Map<String, Object> claims = JWTUtil.validateToken(accessToken); log.info("JWT claims: " + claims); // filterChain.doFilter(request, response); String email = (String) claims.get("email"); String pw = (String) claims.get("pw"); String nickname = (String) claims.get("nickname"); Boolean social = (Boolean) claims.get("social"); List<String> roleNames = (List<String>) claims.get("roleNames"); MemberDTO memberDTO = new MemberDTO(email, pw, nickname, social.booleanValue(), roleNames); log.info("---------------------------------"); log.info(memberDTO); log.info(memberDTO.getAuthorities()); UsernamePasswordAuthenticationToken authenticationToken = new UsernamePasswordAuthenticationToken(memberDTO, pw, memberDTO.getAuthorities()); SecurityContextHolder.getContext().setAuthentication(authenticationToken); filterChain.doFilter(request, response); }catch(Exception e){ log.error("JWT Check Error --------------------"); log.error(e.getMessage()); Gson gson = new Gson(); String msg = gson.toJson(Map.of("error", "ERROR_ACCESS_TOKEN")); response.setContentType("application/json"); PrintWriter printWriter = response.getWriter(); printWriter.println(msg); printWriter.close(); } //destination filterChain.doFilter(request, response); } } 여기가 JWTCheckFilter부분입니다.
-
해결됨코드로 배우는 React 19 with 스프링부트 API서버
access Token 만료 후 todo/list 접속시도 에러 처리
안녕하세요.access Token 정보 만료 후에 서버에서 보내는 메시지가 401 메시지로 옵니다.그래서인지 jwtUtil.js 파일에서 처리를 못하는 문제가 있는 것이 맞을까요?responseFail 을 아래와 같이 수정하는게 맞는지 무엇을 놓치고 있는 것인지 모르겠습니다.http://localhost:3000/todo/list 를 10분 이상 경과후 실행했을 때 에러 메시지를 출력했었습니다.import axios from "axios"; import {getCookie, setCookie} from "./cookieUtil"; import {API_SERVER_HOST} from "../api/hostApi"; const jwtAxios = axios.create() const refreshJWT = async (accessToken, refreshToken) => { const host = API_SERVER_HOST const header = {headers: {"Authorization": `Bearer ${accessToken}`}} const res = await axios.get(`${host}/api/member/refresh?refreshToken=${refreshToken}`, header) console.log("----------------------") console.log(res.data) return res.data } //before request const beforeReq = (config) => { console.log("before request.............") const memberInfo = getCookie("member") if (!memberInfo) { console.log("Member NOT FOUND") return Promise.reject( { response: { data: {error: "REQUIRE_LOGIN"} } } ) } const {accessToken} = memberInfo // Authorization 헤더 처리 config.headers.Authorization = `Bearer ${accessToken}` return config } //fail request const requestFail = (err) => { console.log("request error............") return Promise.reject(err) } //before return response const beforeRes = async (res) => { console.log("before return response...........") console.log(res) //'ERROR_ACCESS_TOKEN' const data = res.data if (data && data.error === 'ERROR_ACCESS_TOKEN') { const memberCookieValue = getCookie("member") const result = await refreshJWT(memberCookieValue.accessToken, memberCookieValue.refreshToken) console.log("refreshJWT RESULT", result) memberCookieValue.accessToken = result.accessToken memberCookieValue.refreshToken = result.refreshToken setCookie("member", JSON.stringify(memberCookieValue), 1) //원래의 호출 const originalRequest = res.config originalRequest.headers.Authorization = `Bearer ${result.accessToken}` return await axios(originalRequest) } return res } //fail response const responseFail = async (err) => { console.log("response fail error.............") console.log(err) const originalRequest = err.config; // 토큰 만료로 인한 401 응답이라면 → refresh 시도 if ( err.response && err.response.status === 401 && !originalRequest._retry // 무한 루프 방지 ) { originalRequest._retry = true; const memberCookieValue = getCookie("member"); try { const result = await refreshJWT( memberCookieValue.accessToken, memberCookieValue.refreshToken ); // 토큰 저장 memberCookieValue.accessToken = result.accessToken; memberCookieValue.refreshToken = result.refreshToken; setCookie("member", JSON.stringify(memberCookieValue), 1); // 원래 요청 재시도 originalRequest.headers.Authorization = `Bearer ${result.accessToken}`; return await axios(originalRequest); } catch (refreshError) { console.error("Refresh 실패, 로그아웃 처리 필요"); // 로그아웃 로직 연결 가능 localStorage.removeItem("token"); return Promise.reject(refreshError); } } return Promise.reject(err); } jwtAxios.interceptors.request.use(beforeReq, requestFail) jwtAxios.interceptors.response.use(beforeRes, responseFail) export default jwtAxios
-
미해결코드로 배우는 React 19 with 스프링부트 API서버
"업로드 및 배포" 후 에러 메시지가 뜨지 않네요..
교재 561페이지를 따라가면서, 위의 메시지까지 받았습니다. 그리고 나서 10여분이 지났는 데도, 교재에서 얘기하는 것처럼 에러 메시지가 출력되지 않네요. 에러 메시지가 없어도 정상적으로 진행이 된 것인가요?
-
미해결코드로 배우는 React 19 with 스프링부트 API서버
bootJar가 어디에 있지요?
교재 560페이지에서 "API 서버 프로젝트에서는 Gradle의 'bootJar'를 실행합니다'라고 되어 있는데, bootJar가 어디에 있지요?
-
미해결코드로 배우는 React 19 with 스프링부트 API서버
해결은 못했습니다만...
거듭된 질문에 한결같이 답변을 해주셔서 감사합니다.교재 9장까지는 문제없이 잘 진행되어서, 10장 부터 새로 작성한, 엔티티, DTO, Repository 싹 다 지우니, 앞서 작성한 테스트는 그나마 제대로 실행이 되는군요. 다시 엔티티부터 하나씩 깔면서, 동시에 테스트를 다시 진행해봐야 겠습니다.
-
미해결코드로 배우는 React 19 with 스프링부트 API서버
testInsertByProduct() 와 관련된 에노테이션은 교재하고 똑같이 했고, log.info만 남기고 나머지 코드는 다 지웠는데도, 여전히 Test Failed가 뜨고, testInsertProduct() 메소드로 진입조차 안되는 군요.
testInsertByProduct() 와 관련된 에노테이션은 교재하고 똑같이 했고, log.info만 남기고 나머지 코드는 다 지웠는데도, 여전히 Test Failed가 뜨고, testInsertProduct() 메소드로 진입조차 안되는 군요.
-
미해결코드로 배우는 React 19 with 스프링부트 API서버
CartRepositoryTests.java 에서 테스트 실행을 시켰더니 tests failed 가 뜹니다.
교재를 똑같이 따라왔는데, testInsertByProduct()에서 tests failed 메시지가 뜨는 군요.서버코드는 cookie_00@naver.com으로 첨부했습니다.