inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

[리뉴얼] React로 NodeBird SNS 만들기

백엔드부분 cors문제 해결하기 강의부분 에러

437

lssoy77

작성한 질문수 13

0

안녕하세요? 강의 잘 듣고 있습니다.

현재 프론트쪽 강의는 다 들었고, 백엔드 강의 듣던 중 'cors문제 해결하기' 강의에서

에러가 나서 문의드립니다.

코드들은 다 잘 따라 친 것 같은데, 회원가입을 누르면 리덕스데브툴즈에서 확인해보면,

요청만 가고 success나 fail이 뜨지 않습니다.

네트워크탭도 캡쳐해서 올려보겠습니다.

화면 캡처 2022-10-04 162521.png화면 캡처 2022-10-04 162552.png화면 캡처 2022-10-04 162616.png화면 캡처 2022-10-04 162630.png

Request Payload에 이메일, 닉네임, 비번 데이터가 있는걸 보면 데이터들은 잘 전송되는 것 같아요

그런데 요청만 가고(계속 로딩중) 그 이후에 성공도 에러도 안뜨네요ㅜ

아래는 app.js 파일에 cors관련 코드입니다.

화면 캡처 2022-10-04 163332.png

Next.js express redux react nodejs

답변 1

0

제로초(조현영)

cors 문제는 해결이 된 것 같은데 회원가입 로직에서 문제가 발생했을 것 같습니다. 백엔드쪽 콘솔에 에러메시지 확인해보세요

0

lssoy77

백엔드쪽에 콘솔도 넣어보고 에러메세지도 확인해보려고 했지만

localhost:3000 의 개발자도구에 백엔드에 작성한 콘솔은 아무것도 뜨지 않고,

localhost:3065 로 들어가서 확인해봐도 아래 사진과 같은 에러메세지가 나옵니다.

원인을 모르겠습니다ㅠㅠ

image

0

제로초(조현영)

콘솔이라는 것은 터미널(명령 프롬프트, 파워셸 등)을 의미하는 겁니다. 브라우저 개발자 도구가 아니라요. localhost:3065 서버를 띄웠던 터미널에 에러가 있을 겁니다.

0

lssoy77

터미널 확인해봤는데 별다른 에러메세지는 없습니다ㅠㅠ

imageimage

이게 전부에요,, 에러메세지라도 나오면 찾아볼텐데 나오지 않네요ㅠㅠ

0

제로초(조현영)

터미널 띄운 후 브라우저에서 요청을 보내보신 것이 맞나요? 터미널에 아무런 요청 기록이 없네요.

0

lssoy77

imageimage

require 부분이 첫번째 require단어의 아래쪽에 ... 이 나오고,

마우스 가져가보면 두번째 사진과 같은 메세지가 나옵니다

그래서 Quick Fix 버튼 누르니 자동으로 import로 바껴지길래

모든 파일들을 다 import로 바꿨더니

어떤 에러가 나왔고, 이 에러는 import로 변환하는 과정에서 직접 추가작업 해줘야 하는게 있는것 같은데

뭘 해야할지 몰라서 에러가 있음에도 일단 회원가입테스트를 다시 해봤습니다. 그랬더니

이번엔 리덕스데브툴즈에서 실패까지는 나옵니다 (실패이유는 제 생각엔 위에 적은 이유(import변환과정)때문에 실패나온것같아요)

기존 require로 했을 땐 실패/성공 둘다 안뜨고, 계속 로딩만 도는 상태 (리덕스데브툴즈 request만 있는 상태)였습니다

일단 다시 require로 코드를 되돌려놓은 상태입니다.

제 생각엔 require 밑에 ... 나오는것때문에 로딩만 계속 되는것 같은데

...을 없애려면 어떻게 해야 할까요?

 

0

제로초(조현영)

아뇨 전혀 상관없는 문제입니다. import로 바꾸지 마세요. 함부로 바꿀 수 있는 게 아닙니다. 브라우저에서 요청이 백엔드 터미널에 기록되는지만 확인하세요.

0

lssoy77

아 그렇군요ㅠㅠ

백엔드 터미널에는 브라우저 요청이 따로 기록되진 않습니다

프론트 터미널은 확인해보니 아래 사진에 있는 경고가 나옵니다

리덕스데브툴즈는 여전히 리퀘스트까지만 나오고 success나 fail은 나오질 않네요ㅜ

image

 

+ 추가

계속 로딩상태로 지속되다가 결국 fail로 뜹니다

데브툴즈에도 실패로 나오고 따로 에러메세지나 이유같은건 안나오구요,

네트워크탭은 아래사진 첨부했습니다!

imageimage

 

 

그리고, http://localhost:3065 를 주소창에 입력해서 접속하려고 하면 계속 로딩만 돌고 접속이 안됩니다

서버가 문제인것같은데.. 잘 모르겠습니다ㅠㅠ

 

0

제로초(조현영)

백엔드서버 app.js 올려보세요.

0

lssoy77

imageimage

백엔드 app.js 파일입니다!

확인해보려고 중간중간 콘솔 추가했습니다

(18번째줄 콘솔 'db연결성공' 과 50번째 줄 콘솔 '서버 실행 중'은 잘 뜹니다ㅠㅠ)

0

제로초(조현영)

네 app.use(express.json()) 입니다.

제가 문제를 해결한 과정을 잘 기억하세요.

0

lssoy77

아 저 괄호때문이었군요ㅠㅠㅠ

넵 해결해주셔서 감사합니다~!

남은 강의들도 더 꼼꼼하게 잘 들을게요!

넥스트 버젼 질문

0

90

2

로그인시 401 Unauthorized 오류가 뜹니다

0

104

1

무한 스크롤 중 스크롤 튐 현상

0

197

1

특정 페이지 접근을 막고 싶을 때

0

116

2

createGlobalStyle의 위치와 영향범위

0

103

2

인라인 스타일 리렌더링 관련

0

98

2

vsc 에서 npm init 설치시 오류

0

159

2

nextjs 15버전 사용 가능할까요?

0

166

1

화면 새로고침 문의

0

129

1

RTK에서 draft, state 차이가 있나요?

0

163

2

Next 14 사용해도 될까요?

0

455

1

next, node 버전 / 폴더 구조 질문 드립니다.

0

359

1

url 오류 질문있습니다

0

218

1

ssh xxxxx로 우분투에 들어가려니까 port 22: Connection timed out

0

391

1

sudo certbot --nginx 에러

0

1295

2

Minified React error 콘솔에러 (hydrate)

0

479

1

카카오 공유했을 때 이전에 작성했던 글이 나오는 버그

0

257

1

프론트서버 배포 후 EADDRINUSE에러 발생

0

341

1

npm run build 에러

0

526

1

front 서버 npm run build 중에 발생한 에러들

0

399

1

서버 실행하고 브라우저로 들어갔을때 404에러

0

351

2

css 서버사이드 랜더링이 적용되지 않아서 문의 드립니다.

0

291

1

팔로워 3명씩 불러오고 데이터 합쳐주는걸로 바꾸고 서버요청을 무한으로하고있습니다.

0

250

2

해시태그 검색에서 throttle에 관해 질문있습니다.

0

207

1