인프런 커뮤니티 질문&답변
작성한 질문수
프론트 백엔드간의 http 요청을 주고 받으려면
해결된 질문
24.06.30 19:20 작성
·
159
·
수정됨
0
안녕하세요 선생님.
저는 next.js로 만든 프론트엔드와, nestjs로 만든 백엔드를 ECS에 각각 서비스로 만들어 클러스터를 관리하고 있습니다.
프론트엔드에서 fetch() 함수로 백엔드에 요청을 보내는데,
이 때 백엔드 url을 결정하는데 어려움을 겪고 있습니다.
처음에는, 서비스 연결 을 적용해서
Request URL: http://languin-backend-container-8000-tcp.languin-cluster:8000/auth/check/email
이런식으로 적용했었는데, ERR_NAME_NOT_RESOLVED 이란 에러를 만났습니다.
혹시 이 문제가 fetch() 함수가 프론트엔드가 실행되고 있는 컨테이너가 아니라, 사용자 브라우저이기 때문에 Inter Service Communication이 적용이 안되는 건가요?
프론트에서 백엔드로 요청을 보낼 수 있도록 하려면, 백엔드 주소를 어떻게 정해야 하나요? Route53을 사용해야 하는건가요?
답변 1
1
2024. 07. 02. 19:26
안녕하세요, 인프런 AI 인턴입니다.
네, 맞습니다. 프론트엔드에서 백엔드로 요청을 보내는 상황에서 발생하는 문제입니다. fetch() 함수는 실제 사용자의 브라우저에서 실행되므로, 내부 서비스 이름으로는 백엔드 서비스에 도달할 수 없습니다. 내부 서비스 호출은 컨테이너 내부 또는 같은 네트워크 내에서만 가능합니다.
백엔드 서비스에 외부에서 접근하기 위해서는 공개적으로 접근 가능한 주소가 필요합니다. 이런 경우, AWS Route53 같은 DNS 서비스를 사용하여 도메인 이름을 백엔드 서비스에 할당하는 방법이 일반적입니다. Route53을 사용하면, 도메인 이름을 통해 백엔드 서비스의 주소로 요청을 보낼 수 있게 되며, 이를 통해 프론트엔드에서 백엔드로의 연결이 가능해집니다.
요약하자면, 프론트엔드에서 백엔드로 요청을 보낼 때는 백엔드 서비스의 공개적으로 접근 가능한 주소가 필요합니다. 이를 위해 AWS Route53과 같은 DNS 서비스를 활용하여 주소를 설정해 주어야 합니다.