The Protocol-relative URL (프로토콜에 따른 URL)

타 부서로부터 어느날 결제관련 페이지 오류 리포팅이 들어왔는데

페이지를 열고 크롬 개발콘솔에 나타나는것을 보니

https:// 페이지인 결제관련 페이지의 헤더에 붙여져 있는

jQuery를 CDN으로 끌어다 쓰고 있었는데 주소가 http://로 되어 있어서

모든 스크립트가 오류를 내 뿜으며 작동하지 않는 문제가 바로 보였으며 아래와 같은 해결책을 찾게 되었습니다.

해결책#1: Google Analytics 삽입 스크립트의 경우 이런 처리를

기본적으로 제공해 주고 있었는데 아래와 같은 형식

var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));

위 방법을 참고하여동적 스크립트 삽입.

해결책#2: Protocol-relative URL

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.js"></script>
<script>!window.jQuery && document.write(unescape('%3Cscript src="js/libs/jquery-1.9.0.js"%3E%3C/script%3E'))</script>

위와같이 URL 부분에 프로토콜인 http 또는 https를 쓰지 않으면 된다.