ajax HTTP, HTTPS에 따른 크로스 도메인 문제

사용자 개인 정보를 서버에 전송할 때 HTTPS로 적용해 달라는 요청이 들어온 적이 있었다.

그래서 주민등록번호나 회원 아이디, 패스워드 등을 서버로 전송하는 페이지에 한해서 HTTPS로 적용되게 URL을 변경하였다.

헌데, 다음과 같은 문제가 발생하였다.

위와 같이 휴대폰 인증 버튼 클릭 시 서버로 요청을 보내지도 못하고, ajax 에러 메시지가 출력된다.

error, No Transport

에러 메시지가 출력되는 원인은 회원 정보 입력 페이지 접근 시에는 HTTPS 프로토콜로 접근하였지만 휴대폰 인증 시에는 HTTP로 요청을 보냈기 때문이다.

ajax에서는 HTTPS, HTTP도 크로스 도메인으로 구분하기 때문이다.

지금까지 크로스 도메인 문제는 메인 도메인과 서브 도메인, 도메인은 같지만 포트 번호가 다를 경우에만 해당 되는 줄 알았다.

허나 ajax는 프로토콜이 서로 다를 경우에도 크로스 도메인으로 구분한다.

결국 위의 문제는 휴대폰 인증 시에도 HTTPS로 요청을 보낼 수 있도록 수정하여 문제를 해결하였다.

또 다른 해결 방법은 JSONP를 이용하는 것이 있지만 굳이 쓸 이유가 없어서 적용해 보진 않았다.