Insecure content in iframe on secure page

I'm in the in the process of developing an application for a client, which will have an SSL certificate and be served under https. However, to integrate with their existing site they want to provide their navigation inside an iframe.

I can see this causing trouble, as I'd expect the browser to complain about the mix of secure and insecure content on the page. I've had a look at similar questions on here and they all seem to refer to this the other way round (secure content in the iframe).

What I'd like to know, then, is: will it cause issues to have insecure content included inside an iframe, placed on a secure page , and if so what sort of problems would they be?

Ideally if it's not a good idea (and I have a strong feeling that it isn't) I need to be able to explain this to the client.

If your page is http then it allows iframe with https content.

But if your page is https then it does not allow http content.

Lets put down following possibilities.

page - iframe - status

http - http  - allowed
http - https - allowed
https- http  - not allowed
https- https - allowed

If your page is being accessed using https://www.example.com/main/index.jsp (SSL) then your browser will complain with "This page contains both secure and insecure items" if there are any resources in the HTML code that are referenced with http:// (non-SSL). This includes iframes.

If your navigation page is hosted on the same server then you can prevent the "insecure content" message by using a relative URL like this...

<iframe src="/app/navigation.jsp" />

From your question it sounds like your navigation page is being served from a separate host and you're being forced to use something like this

<iframe src="http://otherserver.example.com/app/navigation.jsp" />

which will of course cause the "insecure content" message in your browser.

Your only solutions are to either

1. implement SSL on the server holding your navigation page so you can use https:// for your iframe reference, or

2. move the navigation application to the same server so you can use a relative URL.

Personally I can't see why your navigation would be on a different host because then you're going to get JavaScript cross-domain scripting issues (unless some funky JSONP is involved).

Try removing the http: characters in the src attribute's value as so:

<iframe src="//example.com/thefile.htm"></iframe>

This is of course a workaround, security is important so don't bypass blithely, but anyway this once got me past a similar problem.