해결된 질문
작성
·
361
0
안녕하세요!
해당 수업에서 CORS 에러가 발생한 이유를 다른 작성자 분께서 질문해주셨는데, 강사님께서 프론트엔드와 백엔드의 포트가 달라서 그렇다고 대답해주셨습니다.
백엔드에서는 app.listen을 통해 포트를 설정을 해주었지만, 프론트엔드에서는 포트를 설정한 적이 없는데 포트번호를 어떻게 알 수 있나요..?
설정하는 방법이 따로 있는건가요?
그리고 이전수업에서 한 컴퓨터에서는 프론트엔드와 백엔드의 포트번호가 달라야한다고 말씀하셨는데, 그렇다면 하나의 컴퓨터에서는 same origin이 될 수 없는건가요?
답변 1
0
안녕하세요! 정욱님!
프론트엔드는 보통 html을 open-with-liveserver로 열게 되시면 5500번 포트로 실행되는 것을 확인하실 수 있어요!
혹은 리액트 등의 프론트엔드 라이브러리나 프레임워크를 사용하시면 관련된 포트 번호를 받으실 수 있습니다!
다음으로, 한 컴퓨터에서는 포트번호를 중복해서 사용할 수 없어요! 만약 same-origin을 만들고 싶다면, 해당 백엔드 서버에서 프론트엔드 html도 제공해 주면 됩니다!^^
이 방법은 약간 고전적인 방법이며, 프론트엔드 서버 없이, html 페이지 제공을 포함한 모든 것을 백엔드에서 제공(옛날에는 이 방식이 기본)한다고 보시면 되세요!
또 다른 방법으로는, 실제 포트는 프론트 서버 3000포트, 백엔드 서버 4000포트를 띄워놓고, 둘을 묶어주는 프록시서버 80 포트(nginx 등)를 앞단에 배치하시는 방법이 있어요!
프록시서버 관련하여서는 뒷부분 MSA 맛보기 수업에서 실습해보실 수 있습니다!^^
답변 감사합니다!
한가지 더 질문을 드리고 싶은데요!
CORS()를 설정해놓는다면 모든 사이트에 대해 허용이되어 보안상의 문제가 되진 않나요?
CORS(내프론트엔드주소)로 설정을해서 내 브라우저 주소만 허용가능하도록 하면 괜찮을까요??