Docker Compose의 네트워크 구성에 대해서 궁금한 점이 있습니다.

Question

안녕하세요! 강의 정말 잘 들었습니다.

강의를 듣고 나서 혼자 프로젝트에 적용해 보던 중, 몇 가지 궁금한 점이 생겨 질문드립니다.

강의에서는 Docker Compose를 활용하여 세 개의 컨테이너를 하나의 컴포즈 파일로 묶고, 동일한 네트워크를 사용하여 API를 주고받는 방식을 설명해 주셨습니다. 이를 참고하여 직접 간단한 프로젝트를 만들어 실습해 보았는데, DB 연결에는 문제가 없었지만 프론트엔드와 백엔드 간의 통신에서 CORS 문제가 발생했습니다. 혹시 LEAFT 프로젝트에서는 CORS 문제를 어떤 방식으로 해결했는지 궁금합니다.

또한, AWS에 배포할 경우 Docker Compose로 프론트엔드와 백엔드를 하나로 묶어 한 번에 배포하는 것이 일반적인지, 아니면 각각 별도로 배포하는 것이 더 일반적인지도 궁금합니다.

다시 한번 좋은 강의 해주셔서 감사합니다!

데브위키 · Answer

이찬원님 안녕하세요. 데브위키입니다.

먼저 연휴로 인해 답변이 늦어진 점 사과드립니다.

개발 언어마다 일반적으로 CORS 정책을 허용하는 코드가 있습니다.

LEAFY의 경우 src/main/java/com/devwiki/leafy/config/CorsConfig.java 파일에서 CORS를 허용하고 있습니다.

    @Bean
    public WebMvcConfigurer corsConfigurer() {
        return new WebMvcConfigurer() {
            @Override
            public void addCorsMappings(CorsRegistry registry) {
                registry.addMapping("/**")
                        .allowedOrigins("*")
                        .allowedMethods("*")
                        .allowedHeaders("*")
                        .maxAge(3600);
            }
        };
    }

테스트하시는 환경이라면 cors부분에 *를 입력하시면 전체 경우의 수를 허용하기 때문에 이렇게 적용해보시면 CORS문제는 발생하지 않으실 것 같습니다!

AWS에 배포하실 경우라면 EC2를 실행하신 후 도커를 설치하신 다음 compose로 구성해보실 수 있으실 것 같습니다. 개발/테스트 환경이거나 중요도가 낮은 운영 환경이라면 이렇게 구성하는게 편리하고, 실제 운영 환경이실 경우 쿠버네티스 사용을 고려해보시면 좋을 것 같습니다.

강의 들으시면서 더 궁금하신 부분이 있으면 편하게 질문해주세요!

인프런 AI 인턴 · Answer

안녕하세요, 인프런 AI 인턴입니다.

이찬원님, 강의를 재미있게 수강해주셔서 감사합니다! Docker Compose와 관련한 몇 가지 질문에 대해 도움을 드릴 수 있는 정보를 알려드리고자 합니다.

CORS 문제 해결 방법

LEAFT 프로젝트에서의 CORS 문제 해결에는 보통 다음과 같은 접근법을 사용합니다:

백엔드 서버 설정: 서버 측에서 특정 목원(origin)에 대해 CORS 정책을 허용하도록 설정합니다. 예를 들어, Express.js와 같은 Node.js 프레임워크를 사용 중이라면 cors 미들웨어를 적용할 수 있습니다.
```
const cors = require('cors');
app.use(cors({
    origin: 'http://your-frontend-domain.com', // 허용할 프론트엔드 도메인
    credentials: true
}));
```
프록시 설정: 개발 환경에서는 프론트엔드의 개발 서버에서 백엔드 서버로 요청을 프록시하는 방법이 유용합니다. 이렇게 하면 브라우저가 CORS 체크를 우회할 수 있습니다.
환경 설정을 통한 구분: 환경변수나 설정 파일을 사용하여 배포 환경과 개발 환경 등에서 다른 CORS 설정을 적용하는 것이 일반적입니다.

도커 컴포즈를 사용하여 동일한 네트워크 내에서 통신하더라도, 브라우저는 여전히 CORS 정책을 적용하므로 백엔드 설정에서 CORS를 명확히 처리해야 합니다.

AWS 배포 시 Docker Compose 활용

AWS에 배포할 경우 Docker Compose를 활용해 프론트엔드와 백엔드를 묶어 배포하는 것이 가능하지만, 실제 운영 환경에서는 이 둘을 분리하여 관리하는 것이 더 일반적입니다. 각각의 서비스 요구사항에 맞추어 독립적인 개발 및 배포 파이프라인을 구축할 수 있기 때문입니다. 즉, 다음과 같은 방식을 고려할 수 있습니다:

CI/CD 워크플로우: 각 서비스마다 별도의 CI/CD 프로세스를 가질 수 있는데, 이렇게 하면 개별 서비스의 배포 주기를 자유롭게 관리할 수 있습니다.
마이크로서비스와의 차이점: 전체적으로 독립적이고 유연하게 운영되기 때문에, 프론트엔드와 백엔드를 하나의 Compose 파일로만 배포하는 방식은 초기 개발 단계에서 유용할 수 있지만, 장기적으로는 독립적인 배포가 더욱 일반적입니다.

관련된 이전 질문의 예로는 Docker Compose를 활용한 네트워크 구성을 설명하는 “Leafy 네트워크” 질문이 있습니다.

저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.
현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏
추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.

인프런 커뮤니티 질문&답변