안녕하세요. 개인적으로 프로젝트 때문에
react를 이용한 SPA를 제작중인데, SSL을 이용해서 react 웹앱을 https 환경에서 제공해주려고 바꿨습니다.
여기서 Mix content 문제나 소켓 연결이 안되는
많은 문제가 발생하는데요..
api 요청도 'http://api서버주소/...' 로 이루어져 있고, 웹소켓도 'ws://소켓서버주소/...' 로 이루어져 있는데
서버도 https 환경으로 바꾸고 단순히 이것들을 'https://api서버주소/...' 와 'wss://소켓서버주소/...' 로 바꾸는게 해결 방법인가요?
즉, [클라이언트]https -> [서버]http 문제를 해결 하려면
서버도 https로 바꿔서 https -> https 로 해야 하는건가요? (그다음 'https://api서버주소/...' 로 요청하겠지요..?)
아니면 서버단은 http 환경으로 그대로 두고 https로 온 요청을 따로 받아서 잘 처리가 가능한가요?
아직 모르는게 많아서 초보 같은 질문이지만
답변 주시면 감사하겠습니다 __
(추가로 nginx를 이용해서 https를 적용하여 웹서버를 돌리고 있습니다)
메인 웹페이지 자체가 https라면 모든 api 요청, 이미지 로딩, 웹소켓 등에도 동일하게 SSL이 적용되어야 합니다. 웹소켓은 wss, 다른 모든 요청은 https가 되겠지요.
https를 사용하는 이유가 세션 쿠키나 api 토큰 등 민감한 정보가 노출되지 않도록 하기 위해서인데, http를 사용하는 api 요청이나 웹소켓이 단 한 개라도 있다면 거기에 접속할 때 세션 쿠키나 토큰이 노출될 테니 https를 쓰는 의미가 없어집니다. 그래서 최근 브라우저들은 mix content 발생시 이미지 외에는 아예 접속 시도조차 하지 않습니다. (원칙적으로는 이미지도 로딩하면 안되지만, 다 깨져보인다고 사용자들이 너무 싫어해서 타협한 것 같습니다.)