• 카테고리

    질문 & 답변
  • 세부 분야

    프론트엔드

  • 해결 여부

    미해결

nuxtServerInit 무한 로딩

22.03.31 11:59 작성 조회수 612

0

nuxtServerInit 호출에 대한 문제로 질문드립니다.

개발 모드로 실행시엔 문제가 없는데 배포 모드로 실행시에 nuxtServerInit이 계속해서 페이지를 불러오는 현상이 발생합니다.
찾아본 정보들을 적용해봐도 해결이 되지 않아 질문드리게 되었습니다.

이 코드로 실행한 결과

이러한 로그를 남기게 되고, 메모리 점유율이 끝없이 상승합니다.

제가 찾아본 바로는 남은 캐시에 의한 현상이거나 loadUser에서 return이 되지 않아 axios를 기다리지 않고 계속해서 화면을 그리게 된다고 하는데 return을 주게 되면 오히려 페이지가 로드 되지 않고, return을 주지 않은 현재의 코드로 실행시 페이지를 그려주는 것으로 확인되었습니다.


또한 log로 찍은 것은 res.data로 받아온 것인데 정상 동작이라면 req.isAuthenticated에 걸려 401을 리턴해야 맞고,
실제로 개발 모드에서도 401을 리턴합니다만 배포 모드에서만 저렇게 페이지 정보가 res.data에 저장됩니다.

nuxtServerInit의 라이프 사이클 등등 자세한 정보를 둘러보는데도 제 지식으로는 해결이 되지 않아 질문드립니다.

(배포 환경은 AWS 인스턴스에서 Nginx 로 실행하였습니다.)

답변 3

·

답변을 작성해보세요.

0

한범수님의 프로필

한범수

질문자

2022.03.31

와 진짜 감사합니다 ㅠㅠ 정말 생각지도 못한 곳에서 발생한 오류였네요...
혹시 원인이 될만한 코드가 있는 거 같아서 첨부합니다. 혹시 원인이 무엇인지 알 수 있을까요?
영상에서는 https의 경우엔 적지 않아도 자동으로 인식한다고 하셔서 비워뒀던건데

axios에 대한 baseURL이 제대로 적용되지 않아서 그냥 프론트로 요청이 간 것 같습니다.

한범수님의 프로필

한범수

질문자

2022.03.31

정말 죄송하지만 혹시 'axios에 대한 baseURL이 제대로 적용되지 않았단 것'이 무엇인지 좀 더 자세히 설명해주실 수 있을까요?

axios.get('/user')를 하면 기본적으로 현재 서버(프론트)의 /user로 요청이 갑니다. 이게 문제 원인이었고요. 그런데 baseURL 설정을 했으므로 baseURL에 적힌 서버/user로 요청이 가야하는데 이게 안 된 것 같네요. 제가 vue를 더이상 하지 않아서(앞으로도 할 생각이 없어서) 어떤 점에서 바뀐 건지 잘 모르겠습니다.

한범수님의 프로필

한범수

질문자

2022.03.31

아 그럼 vue 내부 문제라는 것이군요. 여기까지 설명해주신 것만으로도 정말 감사합니다.
더 자세한 부분은 제가 해결해야할 숙제인 것 같네요. 정말 감사합니다!

한범수님의 프로필

한범수

질문자

2022.03.31

추가적으로 첨부한 사진의 '//api.~' 앞의 'https:' 를 붙여주니 정상 동작을 하였습니다.

아, 원래는 //가 없으면 알아서 http, https를 판단해주어야하는데요. axios에서는 이걸 판단 못 하는 것일 수도 있겠습니다.

한범수님의 프로필

한범수

질문자

2022.03.31

역시 그냥 original로 하는게 제일 좋은 것 같습니다.

0

한범수님의 프로필

한범수

질문자

2022.03.31

맞습니다. 브라우저 응답이 없이 서버에만 요청이 갑니다.
이 부분이 저도 이상하다고 생각했는데 혹시 무엇이 문제였을까요?

지금보니까 또 console.log(set...), console.log(req.user) 부분은 안 불리네요. 

한범수님의 프로필

한범수

질문자

2022.03.31

제가 봤을 땐 $axios.get으로 받아오는게 페이지이기에 호출이 꼬리물기하는 것 같은데 어떻게 get으로 페이지를 넘겨 받는 건지 모르겠네요 ㅠㅠ

아 그렇네요. /user 대신 명확하게 백엔드 주소까지 다 적어보세요.

0

브라우저 자체에서 응답은 오나요? 혹시 진짜로 요청이 저렇게 많이 서버에 가는 것은 아닌가요?