0

I'm trying to enable HTTPS on my website, and I'm running into an issue where the https web page is importing js/css/fonts/etc from https locations, but the browser is seeing some (not all) of these as http links.

See example on JSFiddle:

<html>
<head>

<!-- This loads correctly as HTTPS content -->
<script type="text/javascript" src="//code.jquery.com/jquery-3.3.1.min.js"></script>

<!-- This is blocked by the browser as Mixed Active Content, even though the page scheme is https -->
<script type="text/javascript" src="//highcharts.com/highslide/highslide-full.min.js"></script>

<!-- Explicitly setting `https` does not change the result -- it still considers this `http` -->
<script type="text/javascript" src="https://highcharts.com/highslide/highslide-full.min.js"></script>

</head>
<body>
<p>Lorem ipsum</p>
</body>
</html>

What is going on? Is the problem at the source? Why does it appear that the browser is arbitrarily replacing https with http? Is it pulling from its cache? (I've tried using Ctrl-F5; is there a better way to rule this out? Why would it not also have cached JQuery the same way?)

This looks to be the same question as How to fix "Blocked loading mixed active content" for css and js over https but the accepted solution there did not help. It's difficult to find other related questions because everything I see seems to just be explaining super-basic Mixed Active Content – that you can't use both http and https in the same page, which I already understand.

user2100826
  • 335
  • 2
  • 3
  • 13
  • 2
    Try `https://www.highcharts.com/highslide/highslide-full.min.js` instead. The reason you’re running into that mixed-content issue is because — even though you can navigate to the https://highcharts.com/highslide/highslide-full.min.js URL as expected if you paste that URL into your browser address bar — the `highcharts.com` web server for some reason responds to your code’s requests for that `https` URL with a 301 redirect to the (non-`https`) URL `http://highcharts.com/highslide/highslide-full.min.js`. – sideshowbarker Apr 16 '18 at 14:03
  • You can observe the same odd behavior from that `highcharts.com` server using `curl`: curl -I https://highcharts.com/highslide/highslide-full.min.js I don’t know why that server responds to requests that way when it doesn’t do so if you navigate to the URL directly in your browser — but it won’t if you make the same request but instead use the hostname `www.highcharts.com` in the request URL: curl -I https://www.highcharts.com/highslide/highslide-full.min.js – sideshowbarker Apr 16 '18 at 14:03
  • Requests to `https://highcharts.com/highslide/highslide-full.min.js` (that is, no-`www`) can also be made to work as expected if you add a `Host: www.highcharts.com` request header: curl -I -H "Host: www.highcharts.com" https://highcharts.com/highslide/highslide-full.min.js – sideshowbarker Apr 16 '18 at 14:04

0 Answers0