[Web] 초보 웹 프론트엔드 개발자가 백엔드와 통신할 때 오류가 난다면?

일단 네트워크 탭을 뜯어보면 대략적인 파악이 가능합니다. 요청이 의도한 대로 보내졌는지, 맞는 메소드로 맞는 주소에 요청을 보냈는지 확인해 보면 도움이 됩니다.

1. 코드에 오타가 없는지 확인합니다.
2. 네트워크 탭을 까봅니다.
3. 요청 Payload, 요청을 보낸 API 주소, 메소드와 헤더를 파악해 오류가 있다면 수정합니다.
4. Postman에서는 잘 되는지 확인해봅니다. (Postman에서는 잘 된다면, 클라이언트 쪽 문제일 가능성이 높겠죠?)
5. 위의 정보와 응답값을 백엔드 개발자에게 전달하고 확인을 요청합니다.

저는 대략 이런 식으로,, 확인 요청을 드렸습니다.

다음은 흔히 발생할 수 있는 오류들이라서 정리해봤습니다.

Q. CORS 에러가 나요.

A. 백엔드 개발자에게 CORS를 뚫어달라고 요청합니다.

Q. Method Not Allowed 오류가 떠요.
A. POST 메소드로 보내야 하는데 GET 요청을 보내지 않았는지.. 메소드를 확인해 봅니다.

Q. POST를 보냈는데 Bad Request래요.
A. 만약 body를 JSON으로 보낸다면 헤더에 "Content-Type": "application/json"을 넣었는지 확인해 봅니다.

Q. 파일 업로드가 안 돼요.
A. 파일 업로드 용량 제한이 있는지 확인해달라고 합니다. (Nginx 기본 요청 body 용량 제한일 수도 있습니다.)

Q. 로컬에서는 잘 되는데 배포했더니 안 돼요.
A. 배포된 주소가 CORS 허용에 등록되었는지, 배포된 주소는 https인데 서버는 http인 건 아닌지, 배포 환경에 환경변수를 작성했는지를 확인해볼 수 있습니다.