How to Fix Mixed Content Warning on HTTPS Website
Are you receiving the "mixed content error" in your web browser? Check out this tutorial on SSL certificate providers and how to fix this problem on your HTTPS site.
Join the DZone community and get the full member experience.Join For Free
If you migrated your website from HTTP to HTTPS, but were still getting warnings in the browser about mixed active content or "your connection to this site is not fully secure," then this article is perfect for you!
The browser displays a Mixed content warning when the site is not fully protected or secure all content. When a webpage contains a mixture of secure (HTTPS) and non-secure (HTTP), content is delivered over SSL to the browser, causing the mixed content error to occur. A mixed content error occurs when HTTP assets are loaded on an HTTPS page.
How Mixed Content Error Is Displayed in the Browser
This is what a mixed content error on Firefox address bar looks like. The padlock is dark with a warning sign. In Firefox, it will block insecure content on the page, and it will remove the padlock and display the icon, which indicates that it has a blocked content.
In Chrome, from October 2017, pages with a form will show "Not secure" when entering data on the page. And, in a different version, it shows it in a different manner.
How to Fix Mixed Content?
1. One way is to find mixed content is by visiting the site and using the browser’s inbuilt tools. This can also help you to find any insecure scripts that are loaded over an HTTPS request.
2. You can also search in your source code for HTTP links.
3. Use Screaming Frog SEO Spider tool
4. Use the JitBit Scanner
5. Use the HTTPS Checker
Solution: Fixing Mixed Content Error
There are many methods to fix this error, below we describe two ways to resolve this error:
- Once you get the content served over HTTS vs. HTTPS, then you can fix the issue by simply adding an "S" to links- http:// to https://. Check if the resource is available over an HTTPS connection by copying and pasting the HTTP URL into a new web browser and changing it from HTTP to HTTPS. If it is available over HTTPS, then you can simply change HTTP to HTTPS.
- One rule of thumb is to always load resources and make requests using HTTPS protocol — standard web programming recommendations would also be helpful.
If you want to find mixed content more easily and quickly, use crawling services, like HTTPSChecker.
In addition to fixing all the mixed content on the website, you should also be conscious about which SSL certificate provider you are choosing. Because Google is planning to unrecognize Symantec and associated SSL certificate providers, that means Google Chrome and the Google page ranking will consider certificates from these SSL certificate providers as invalid. Moreover, if you have been planning to invest in an EV SSL, which costs a lot more, go for SSL certificate providers like Comodo.
Opinions expressed by DZone contributors are their own.