CORS 허용하는 방법을 알 수 있을까요??

Question

먼저 좋은 강의 만들어 주셔서 감사합니다. 덕분에 코딩이란 것에 조금씩 눈을 떠가고 있습니다. 앞으로도 좋은 강의 만들어 주시길 기대하고 있겠습니다. 본론을 말씀 드리자면 CORS 허용하는 문제에 대하여 조언을 얻고자 합니다. 강사님의 이번 강의를 바탕으로 docker-compose 를 이용하여 웹서버 및 플라스크 서버를 돌릴 수 있게 되었습니다. 다만 웹서버에서 플라스크 서버에 API 요청을 보냈을 때 CORS 이슈가 발생하더군요. 이전 CORS 강의에서 다뤄 주셨던 방법을 적용하여 보았지만 해결이 되지 않았습니다. 구글에서 검색한 방법도 잘 적용이 되지 않았습니다. 한동안 헤메다가 혼자서 해결하기 어려워 부득불 질문을 남기게 되었습니다. 강사님의 고견을 알려 주시면 큰 도움이 될 것 같습니다. 감사합니다.

잔재미코딩 DaveLee · Answer

안녕하세요. 어휴 뭐 이렇게 겸손한 글을 써주시니 강의가 도움이 되었으면 좋겠네요. 물론 각자 상황은 다를 수는 있을 것 같지만, 웹서버의 웹페이지에서 Javascript 로 플라스크서버로 API 호출을 하니, CORS 이슈가 발생한다는 말씀이신거죠??? 아니면 어떤식으로 요청을 하신 것인지는 궁금하네요. 일단은 직접 플라스크 서버에 주소/util/search 와 같이 호출하는 것은 큰 문제가 없을 것이고요. javascript 로 하는지, vue 로 하는지, 어떤 것으로 하는지에 따라 다를 수는 있을 것 같습니다. axios 를 쓰신다면, axios 상에서도 CORS 를 처리하는 코드를 다음과 같은 링크를 참고하셔서 테스트해보시면 어떨까요? https://stackoverflow.com/questions/50949594/axios-having-cors-issue 다음으로 nginx 서버 설정 부분에서도 다음과 같은 예를 참고하셔서 설정을 넣어보시면 어떨까해요. https://stackoverflow.com/questions/45986631/how-to-enable-cors-in-nginx-proxy-server 아무래도 더 정확한 것은 저도 한번 해당 코드를 구현해서 테스트를 해봐야, 정확히 어느 부분에 어느 코드를 넣으시면 된다고 말씀을 드릴 수 있을 것 같은데, 각각의 코드를 구현해볼 수 있는 상황은 아니라서 이해를 부탁드립니다. 요청하신대로 조언을 추가하자면, 매우 각각의 케이스가 특별한 경우라서요. 검색해도 딱 해당 케이스가 안나오는 경우가 있습니다. 지금은 nginx proxy server 에 nginx server 에 flask server 인 상황이고, 만약에 axios 를 쓴다면, axios 로 호출할 때의 html header 부분, 거쳐가는 nginx proxy server 부분, flask server 부분 이렇게 세가지가 걸릴 것 같아요. 그래서 각 부분을 하나씩 놓고, 각 부분에 문제가 없는지를 최대한 파악해서, 설정하면서, 각 부분을 만들어보시면 좋을 것 같습니다. 감사합니다.