Using Protocol Relative Links To Fix Mixed Content Warnings
One of the problems with running a HTTPS website like Servertastic is making sure all the content loads over HTTPS to prevent mixed content warnings in browsers.
One of the ways to do this is to hard code all links to external scripts with https. However this does bring some disadvantages. If your page is being loaded over standard http the server still has to perform the SSL handshake to download the https files adding a slight overhead to the page download.
One of the ways around this is to ensure all your image and css links use relative urls
img src="images/logo.png"The above is an example of a relative url. This means the image wil be loaded via http or https depending on the URL used in the browser.
But many websites these days use external scripts such as twitter widgets, ajax or javascript.
<script src=”https://cdnjs.com/ajax/libs/ace/0.2.0/ace.js” type=”text/javascript”></script>The above example is of ajax included from the Microsoft CDN. The url is using https to call the js file. But if the website could be loaded over standard http then it could be a waste to always download the js file via https.
<script src=”//cdnjs.com/ajax/libs/ace/0.2.0/ace.js” type=”text/javascript”></script>In this example we have removed the https: element from the URL. This means that the js file will be downloaded whatever mode the website is currently in http/https.
Caching Problems
The major caveat with this method is that the users browser may cache both the http and the https version of the file. If only the https version is called then this will always be cached which may speed up browsing.
