What problems arise from mixing HTTP and HTTPS content through iframes? - http

If I use HTTP images or JS content within an HTTPS iframe (//) within that HTTPS site, is there a problem?
Site: HTTPS
iframe within site: HTTPS
image content within iframe within site: HTTP
What happens to the browser (safari, explorer, chrome, ios safari ...., ) in this case?
enter image description here
Above is an image of the current situation.
To help you understand better
I thought it was going to be a problem.
There are no problems with the current site and no web browser errors.
It is very strange.

Related

ssl mixed content errors in browser

I have recently installed a flexible ssl on a Wordpress website using CloudFlare. I have read around the issues others have had. I have installed various plugins to remedy the problem. I have tested the url on an ssl checker which says it is OK. When the page first loads I have the green lock - it subsequently goes Amber with an exclamation (on Firefox) or just the 'i' on Chrome.
Chrome console says:
Mixed Content: The page at https://example.com/ was loaded over HTTPS, but requested an insecure image http://example.com/wp-content/uploads/logo1.png. This content should also be served over HTTPS.
In Chrome console it shows that there are some images which load are loading with http - but if you look at the actual image in the WP library it has https in front, including the one above. If I look at images on the front page with say Firefox developer all image paths are preceded https://. If I check the logo image guid in the WP DB which is throwing the error on the front page then it is https://. I have purged the Couldflare cache. I have cleared all browser cache.
So what's the problem?

HTTPS with iFrame that is also HTTPS

OK i am not sure if what i am trying to do is even possible.
We have a page that is HTTPS, and it has a fancybox that opens an iFrame that is also HTTPS. But the iframe wont load.
Now if i take the originating page and remove the HTTPS from the URL and load the fancy box the iframe that is HTTPS will now load.
So my question is can HTTPS page load a HTTPS iframe? If it is possible do you need special code to do so?
Also worth noting that if i remove the fancy box from the equation i get the same results.

Site SSL content issue on Firefox and IE

My site is no securing the online transactions. I found the ssl setting and turned it on, but it still does not appear to be working properly. Below are some images for IE and Firefox. Although the https is present, it does not appear to be securing the site. This is mainly issue credit card information page. How to solve this.
image below
Your page is made up of secure and insecure content. Firefox is blocking the insecure stuff.
For example, your page is served from https://www.example.com/index.html, but some of the content within it it is served from http://www.example.com/images. Firefox will block the content from the second location. That's what the message in your image says.
You should serve all your content through a secure channel. i.e. serve everything from https://www.example.com

Images uploaded in wordpress have http rather that https in URL

When the chrome the developer tool on some of my web pages I get this warning
"The page at https://www.improvementskills.org/wordpress/whats-going-on-2/ displayed insecure content from http://abim3.improvementskills.org/wordpress/wp-content/uploads/2013/08/run_chart2.png.
www.improvementskills.org/wordpress/whats-going-on-2/:1"
I'm guessing this is because the image urls have http rather https. Whenever I upload new images in wordpress it gives it http as well. How do I go about fixing this? Thanks!
Update: The technique in my comment below is now an anti-pattern! Always use https. http://www.paulirish.com/2010/the-protocol-relative-url/
If you can edit your website's img tags, then remove "http:" from the src.
Bad
http://abim3.improvementskills.org/wordpress/wp-content/uploads/2013/08/run_chart2.png
Good
//abim3.improvementskills.org/wordpress/wp-content/uploads/2013/08/run_chart2.png
This way, the browser will call the image with https when needed, and http otherwise.

No Google fonts working in Google chrome

Here is the link
If you click the squares within the black section they will change the font of the word to the left. All of the fonts are Google fonts but non of them are working in Google Chrome. I've searched the internet with no solution. All other browsers it is working fine.
You are getting an error message that explains a bit more. Try pressing F12, then click on the Console tab. You'll see the error message
[blocked] The page at https://branard.com/index.php?option=com_brands&view=detail&id=16&Itemid=102 ran insecure content from http://fonts.googleapis.com/css?family=Erica+One|Monda|Sacramento|Oleo+Script+Swash+Caps|Text+Me+One|Seymour+One|Cagliostro|Qwigley.
Chrome now displays this message when you fetch insecure content via HTTP when the main page is running HTTPS.
It should just be a matter of changing the font url from http://fonts.googleapis.com/css to https://fonts.googleapis.com/css to secure this link.
This is a security feature of the browser that blocks http content included from a host page served via https. The fix is simple: just remove the protocol from all resource URLs (scripts, stylesheets, etc.). In your case, the URL to the fonts CSS becomes
//fonts.googleapis.com/css…
Notice that the URL has no http or https.

Resources