I am trying to embed an iframe (containing shellinabox, if that's relevant) onto an HTTPS webpage. The HTML I'm using to embed the iframe is pretty straightforward:
<div class="jumbotron" style="min-height: 400px;">
<iframe src="https://example.com/shellinabox" style="border:none; min-height: 400px;" width="100%"></iframe>
</div>
However, Chrome blocks the iframe from loading because it is "insecure content," and I have to manually unblock it for it to work. The Chrome console reports an error like this:
Mixed Content: The page at 'https://example.com/mainpage/' was loaded over HTTPS, but requested an insecure resource 'http://example.com/shellinabox/'. This request has been blocked; the content must be served over HTTPS.
I am confused by this because clearly my HTML code is embedding the HTTPS version of example.com/shellinabox
. Moreover, when I visit https://example.com/shellinabox
directly, the lock icon is green, nothing is blocked, and there are no indications of any SSL problems on that page.
I also tested this in Firefox, IE, and MS edge, and they all have the same behavior (so it's not a Chrome-specific issue). What gives?