I've got a parent site: https://a.company.com
, which contains an iframe with HTTPS content (https://b.company.com/foo
) and everything is happy so far. But, when a redirect occurs to load a different route on that same domain, Chrome blocks it as a mixed content error.
Viewing the request in the network traffic confirms that the browser is requesting https
, yet Chrome still cancels the request citing that I can't load mixed (http
) content.
All searching has got me so far is to people trying to load mixed content which is not the case here.
For reference this is the chrome error:
Mixed Content: The page at 'https://a.company/foo' was loaded over HTTPS, but requested an insecure resource 'http:/b.company/bar'. This request has been blocked; the content must be served over HTTPS.
The actual frame source is https://b.company/foo
which has a possible redirect to https://b.company/bar
. If the page does not redirect no error occurs.
As previously stated: you are not allowed to load unsafe HTTP content within an HTTPS-served website since it would compromise the security. If you try to do it anyway, Chrome will prevent it and throw the aforementioned error.
The first step to ensure that you are indeed requesting via HTTPS is to check the URL in the iframe
, which should look like this:
<iframe src="https://foobar.com"></iframe>
↑
this needs to be HTTPS
Now take that exact URL and paste it into any browser to see what rules are in place. If you are redirected in any way, it is possible that an unsafe HTTP connection is used after or in between the redirects. They might even have a straight HTTPS-to-HTTP rule in place (unlikely). Also check the console since they might attempt to load unsafe content within their HTTPS-served page as well which could result in an error on your end. If you find one of those things but you have no access to the server your journey ends here unless you want to serve that content so badly that you are willing to use HTTP yourself.
If, on the other hand, you have access to the server you could remove those redirects or check their configuration. Since there are many different web-servers, operating systems and configurations I won't attempt to give a general tutorial but it shouldn't be hard to find with the search engine of your choosing.
Generally speaking: If the content you want to load is served exclusively via HTTPS it will work.
When everything in the browser seems to work correctly (no visible redirects) and you still get the error you could use Wireshark or other tools to log your traffic. It could be a misconfigured HTTPS that messes up the handshake in some way Chrome doesn't like. Post those logs on SO or share the website you want to display in your iframe
so we can analyze it further since it is unlikely that there is a general solution.
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