js加載腳本的方式有很多,但是各有各的用途。
最近公司https項目改造,對於資源文件這一塊,也是遇到一些問題,現在就來總結一下,怎樣改造https的腳本吧~!
方法1、借助服務端語言如PHP,輸入當前是https或者http的標識到html頁面,再次編譯后得到輸出結果。【有服務端語言參與時推薦】
<script type="text/javascript" src="{$__SYS_URL__.__httpsUrl__}/dataster2/js/jquery.min.js"></script>
方法2、使用html標簽base 替換該變量,其他地方的變量則用相對路徑即可,如 /img/a.png ... 【有功能局限】
<base id="based" href="http://res.cccc.com/"> <script type="text/javascript"> var host = window.location.host; if(host.indexOf("eccc") > 0){ $("#based").attr("href","http://res.ccc.com/"); }else if(host.indexOf("xxxx") > 0){ $("#based").attr("href","https://res.cccc.com/"); } </script>
方法3、使用html自帶的特性,自動獲取當前協議填充 【方便易用、推薦】
<script type="text/javascript" src="http://cdn.ccc.com/static/common/lib/a.js"></script> <!-- 改為 --> <script type="text/javascript" src="//cdn.ccc.com/static/common/lib/a.js"></script>
方法4、使用js腳本加載script文件,添加到dom中 【在有些需求場景,低侵入式操作推薦】
<script type="text/javascript"> //在每個需要的地方加該代碼,好煩吶 var hm = document.createElement("script"); hm.src = "//hm.baidu.com/hm.js?96664522"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s); </script>
方法5、將原始腳本拷貝到本項目中,使用相對路徑加載 【最笨的方法,不推薦】
<script> var cc = 1; //... //... </script>
注意:
1. 使用https協議加載網頁時,一些低版本的app可能不支持,需要避免該情況。
2. 當https協議的網頁中,包含了http的資源文件時,該網頁將會被認為是有不完全的連接,因此一改造https,應將所有http鏈接改為https。
3. https證書盡量使用國際證書,如果有多個二級域名時,應買通配證書而非某特定域名證書。
暫且總結如此。