JavaScript Detect Protocol (HTTP/ HTTPS) To Load Or Handle Accordingly

If you site’s running on both HTTP and HTTPS, we will need to determine whether the HTTP protocol for the requested page is either secure (HTTPS) or standard (HTTP) to load/write the appropriate external assets files or handle process correspondingly.

1. JavaScript Detect Protocol To Load External File

A piece of JavaScript below gives an example to detect the protocol of current page to load the appropriate Google Analytics js file:

<script type="text/javascript">
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"));
</script>

2. JavaScript Detect Protocol To Handle Process Accordingly

JavaScript code below detects protocol to respond accordingly.

<script type="text/javascript">
	if("https:" == document.location.protocol)
	{
		document.write("<h2>The page is loaded via HTTPS</h2>");
 
		// your code for HTTPS ...
	}
	else
	{
		document.write("<h2>The page is loaded via HTTP</h2>");
 
		// your code for HTTP ...
	}
</script>

3. Demonstration

+ HTTPS: https://4rapiddev.com/demo/HTML/load_http_https.html

+ HTTP: http://4rapiddev.com/demo/HTML/load_http_https.html