Menu
When attempting to view my site over https, I keep getting a "Blocked loading mixed active content" error in my Firefox console. I am getting this error only for my css and js file.
The reason I am so confused is because the reference to the files in the page code itself is https:
<link rel="stylesheet" href="https://www.example.com/style.css">
But in the console, it shows it as http:
Blocked loading mixed active content "http://www.example.com/style.css"[Learn More]
I can do a view source on the page and search for "http://" and there are no results anywhere on the page.
Any ideas?
488
The best strategy to avoid mixed content blocking is to serve all the content as HTTPS instead of HTTP. For your own domain, serve all content as HTTPS and fix your links. Often, the HTTPS version of the content already exists and this just requires adding an "s" to links - http:// to https://.
The mixed content error occurs when both HTTP and HTTPS assets are being loaded from a web page that was requested to be fetched as HTTPS. The browser receives a secured page that includes insecure resources like videos, images, or scripts, and blocks this mixed content to protect its user.
How to fix your website. The best strategy to avoid mixed content blocking is to serve all the content as HTTPS instead of HTTP. For your own domain, serve all content as HTTPS and fix your links. Often, the HTTPS version of the content already exists and this just requires adding an "s" to links - http:// to https://.
Starting with Firefox 23, Firefox blocks active mixed content by default. This follows a practice adopted by Internet Explorer ( since version 9) and Chrome. This page explains what you should be aware of as a web developer. If your website delivers HTTPS pages, all active mixed content delivered via HTTP on this pages will be blocked by default.
After setting up automatic redirects from http to https you may start seeing browser warnings about " insecure content " or " mixed content " and some content may be blocked and not displayed, this is because some of the external content references in your html are still using an insecure "http://" url.
When an HTTPS page has HTTP content, we call that content “mixed”. The webpage that the user is visiting is only partially encrypted, since some of the content is retrieved unencrypted over HTTP.
I think that you can try with relative protocol caller.
<link rel="stylesheet" href="//www.example.com/style.css">
---------^^
if your users visit your web in http, it loads http, and if the user visit under https it loads https.
93
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
