https 적용 후 문제 발생
Mixed Content: The page at '[<https://classtest.site/test>](<https://classtest.site/test>)' was loaded over HTTPS,
but requested an insecure resource '[<http://52.79.232.220:8080/users>](<http://52.79.232.220:8080/users>)'.
This request has been blocked; the content must be served over HTTPS.
https 에서는 http로 요청을 보낼 수 없도록 막혀있음. (mixed content)
프론트 코드 중에서 데이터를 가져오는 경로를 https://classtest.site/… 로 수정해줘야 함. 접속은 https로 되어 있는데, http로 요청하기 때문에 발생하는 오류
근데 경로를 수정해도 해결되지 않았음.
처음엔 단순히 백으로의 요청을 https로 바꾸면 되겠다 싶었는데, springboot는 https를 사용하고 있지 않는 상태이기 때문에 해결되지 않았다. 주소창에 적어서 접속 시도해도 안 들어가지지 않았음.
그러면 spring boot의 application.properties를 수정하여 https를 사용하도록 하면 되는데, 이렇게 하려면 기관에서 발급받은 SSL 키가 필요하다. 나는 AWS Certificate Manager를 통해 https 인증을 받았기 때문에 이 방법은 사용할 수 없다.
이러면 포트포워딩 설정을 달리 해주면 해결될 것이다.
springboot로의 요청은 8080으로, react로의 요청은 3000로 포트포워딩하도록 설정해주면 된다. 근데 내 경우엔 springboot와 react의 요청 경로가 같은데 어떻게 구분을 시키는게 좋을까? springboot 엔드포인트 앞에 모두 /api를 붙이면 구분할 수 있다.
Ubuntu 환경에서 특정 경로(예: /api)로 들어오는 요청을 8080 포트로 포워딩하기 위해서는 iptables를 사용하여 NAT 규칙을 설정해야 한다.
그러나, iptables는 포트 포워딩에 경로를 직접 지정할 수 없기 때문에, 대신 nginx와 같은 리버스 프록시 서버를 사용하는 것이 더 적합하다.
ec2에 nginx를 깔고 아래와 같이 설정했음.
Nginx 설치:
sudo apt update
sudo apt install nginx
Nginx 설정 파일 수정:
Nginx의 설정 파일을 수정하여 /api로 들어오는 요청을 8080 포트로 포워딩한다.
아래 명령어를 통해 /etc/nginx/nginx.conf 또는 /etc/nginx/sites-available/default 파일을 수정 파일을 열어 수정한다.
sudo nano /etc/nginx/sites-available/default