Migrating your website to HTTPS may seem like a simple task. Get the TLS/SSL certificate, install it on your web server, and you’re done.
The real pain for large projects, however, is changing http:// resources to https://. These resources include images, videos, sounds, forms, scripts, and CSS files, along with any externally loaded third-party elements like tracking, ads, and widgets.
If an HTTPS page includes any of these elements served over the HTTP protocol, they are passed unencrypted from your web server to a visitor’s browser. This problem is called mixed content and can pose a number of different threats to your website and visitors. For example, an attacker can see what images the visitors are viewing — and even replace images with their own.
Leaving even just a single benign image loaded over HTTP poses serious privacy risks, as it allows bad actors to track what pages are being visited. In a worst-case scenario, mixed content can also allow attackers to intercept and rewrite active content such as scripts or iframes, potentially taking full control of your page or even your entire website.
When mixed content is detected in modern browsers, they show the HTTP image but change a status icon in the address bar to indicate a problem.
Safari hides the padlock icon, Firefox shows a small warning icon, and the current version of Chrome shows an information icon. Site visitors can click on these icons to read more about the problem.
Upcoming Changes for Chrome 80
In Chrome 80, which has an anticipated release date of early 2020, mixed images will still be loaded over HTTP but will cause Chrome to display a noticeable “Not secure” warning in the address bar.
Chrome 80 will try to load mixed audio and video resources over HTTPS. If changing http:// to https:// is enough, the videos will be displayed. If it fails, the videos will not be loaded over HTTP — and website owners will need to fix the URL manually.
Upcoming Changes for Chrome 81
Chrome 81 will treat mixed images the same as videos: the browser will first try to load the image by replacing http:// with https://. If the image cannot be loaded over HTTPS, then it will not be displayed.
Locating & Fixing Mixed Content
In a large project, it’s easy to miss http:// resources and serve mixed content. We’ve outlined a couple of steps you can take to mitigate risk and prevent warnings in the upcoming versions of Chrome.
One simple method you can employ yourself is to use grep and database search-and-replace tools to find and fix any HTTP URLs.
Another quick-and-dirty solution is to add the upgrade-insecure-requests directive to your Content-Security-Policy header. In this case, the browser will automatically rewrite http:// resources to https://. If the https:// URL is different, this solution certainly won’t help.
That being said, one common problem is HTTP resources from third-party servers, such as CDNs or web APIs, which can be a source of mixed content warnings — just like the resources hosted on your server. That’s why running a grep search for http://your-website.com is not enough; you can miss something like http://chart.apis.google.com.
Third-Party Tools for Fixing Mixed Content
Sucuri provides SiteCheck, a free security scanner that can find mixed content on your website. SiteCheck scans the source code of your page to find potential problems — even if the resource is not displayed by default.
For GoDaddy customers, we provide a Managed SSL Service which can also be helpful. If your website is hosted at GoDaddy and you choose this service, we will install the TLS/SSL certificate and fix the mixed content warnings for you.
If you choose to fix mixed content yourself, then Sucuri SiteCheck is a nice addition to grep and database search tools.