본문 바로가기

프로그래밍49

[JPA] LazyInitializationException 해결 JPA https://jsonobject.tistory.com/605 Jackson 라이브러리는 기본적으로 엔티티의 Getter 메서드를 사용하여 JSON을 생성합니다. 따라서 Getter 메서드가 있고, 그 메서드가 연관 엔티티에 대한 접근을 포함하고 있다면, Jackson은 해당 메서드를 호출하게 됩니다. FetchType.LAZY로 설정된 연관 엔티티가 있을 경우, Jackson이 해당 연관 엔티티의 Getter 메서드를 호출하면, JPA는 연관된 엔티티를 로드하려고 시도합니다. 만약 이 시점에서 JPA 세션이 닫혀 있으면 **LazyInitializationException**이 발생하게 됩니다. 해결방법 → 연관엔티티가 있다면 Jackson 라이브러리가 Getter를 동작시키기 때문에 DTO를 .. 2023. 9. 29.
[React] 리액트 학습 React 렌더링 방식 내부 상태값(state)이나 중앙 상태값(redux store 등)이 변경되는 경우 부모 컴포넌트가 재렌더링되는 경우, 자식 컴포넌트도 재렌더링. React 컴포넌트에서 return nul*을 사용하면 해당 컴포넌트는 아무것도 렌더링되지 않습니다. 이 방식을 사용하면 조건에 따라 특정 컴포넌트를 출력하지 않도록 만들 수 있습니다. useEffect(() => { // 데이터를 비동기적으로 가져옵니다. fetchDataFromAPI().then(responseData => { setData(responseData); }); }, []); // 데이터가 없을 경우 아무것도 렌더링하지 않습니다. if (!data) { return null; } 렌더링 순서 컴포넌트 함수 호출 컴포넌트 .. 2023. 9. 29.
[Vue] Axios post cookie null 백엔드는 spring security, 프론트엔드는 Vue로 구성해서 로그인, 로그아웃, Post 요청 처리를 하는 도중 계속해서 cookie가 전달되지 않는 문제가 있었다. 요청마다 withCredential을 true로 설정해주면 되었는데, 또 다른 문제는 get 요청은 동작하는데 post 요청은 동작하지 않았다. 전역으로 설정하니 post 요청도 해결되었다. 알고보니 axios post 메서드에는 매개인자 순서가 있다. post(url, data, config) 순서로 넣어주면 동작한다. post(url, config) 으로 넣어서 동작하지 않았던 것 Axios api가 컴파일 에러, 런타임 에러가 나지않고 동작하여 이걸 눈치채지 못했다. 도움이 된 곳 https://yamoo9.github.io/.. 2022. 10. 21.
웹 요청 정리 요청 시 토큰은 여러 종류가 있고, 헤더에 토큰 종류를 명시한다. Authorization : Basic xxxx - id, pass를 base64 인코딩 Authorization : Bearer xxxxx - 보통 JWT를 사용할 경우 보안 설정 - 서버 설정 Access-Control-Allow-Credentials : true 로 설정하게 되면, Access-Control-Allow-Origin 를 "*" 로 할 수 없다. 모든 Origin의 Credentials를 허가하는 것은 위험하기 때문 Pattern, whiteList을 이용하거나, 클라이언트 Origin을 명시해서 적어야한다. - 브라우저 클라이언트 설정 withCredential : true 2022. 10. 20.
[쿠키] Javascript로 쿠키에 직접 접근, HttpOnly, CORS 서버에서 쿠키를 만든 후, Vue에서 응답 쿠키를 확인하려고 했지만 Vue를 사용하는 브라우저에 쿠키가 들어오지 않았다. 이유는 서버에서 쿠키는 HttpOnly를 true로 브라우저에게 전송한다. HttpOnly로 설정된 쿠키는 브라우저에서 실행하는 JS로 "직접 접근"할 수가 없다. XSS공격으로 자바스크립트를 이용한 쿠키 탈취를 할 수 있기 때문에 막아둔 것. - 브라우저의 저장된 쿠키를 사용자가 모르게 실행시켜서, 해커 자신의 서버로 전송할 수 없도록 한다. 쿠키에는 Secure 설정도 해줄 수 있는데, Secure true 쿠키는 https를 이용해야만 서버로 전달해줄 수 있다. 응답으로 브라우저에 저장은 가능하다. 해결 { withCredentials: true } 로 설정하면 브라우저에 쿠키가.. 2022. 10. 19.
[Vue] Vue 구조 파악해보기 Vue 설치 npm install -g vue npm install -g @vue/cli -g global cli 를 사용해서 환경 설정을 통일화. Vue 프로젝트 생성 vue create 프로젝트명 Vue 프로젝트 실행 cd 프로젝트 내부 폴더로 이동 npm run serve package.json 의존 모듈 관리 node_modules 적용된 모듈들을 볼 수 있다. 초기 설정 살펴보기 main.js Vue를 실행하면 가장 먼저 main.js 가 실행된다. App.vue에 index.html 에 있는 div id="app"을 마운트 시킨다. 전역 설정은 이곳에 추가한다. App.vue 라우터가 포함되어있다. 전역으로 사용되는 template, style을 이곳에서 관리한다. #app은 최상위 div가 .. 2022. 10. 18.