Assets not loaded when using CloudFlare SSL - http

I recently installed SSL from CloudFlare Flexible SSL but when I use https it doesn't seem to load image and CSS assets.
I already disabled hotlink protection.
Here are some images to illustrate the difference:
Using https: http://gyazo.com/ef6ccb13c2c8f3f797dcb2d947a772cb
Not using https: http://gyazo.com/be277259e0dcc8e395316b573de12935
Thankful for help!

A look at the browsers console shows lots of messages like this:
Mixed Content: The page at 'https://hornetvault.com/' was loaded over HTTPS, but requested an insecure stylesheet 'http://www.hornetvault.com/templates/fresh/assets/css/styles.css'. This request has been blocked; the content must be served over HTTPS.
Which means you try to load resources using http:// inside a https:// site and these resources get blocked. You need to load these resources by https:// too. You might try to simple use // instead of explicitly given http:// or https:// in your URLs, in which case it will simply use the same scheme (http or https) as the page itself.

Related

URL change in HTTPS automatically

Test URL = https://www.uktherapyhub.co.uk/info.php
Code is below
<?php include 'wp-load.php'; ?>
http://adrianmatthewstherapy.co.uk
Above is my code why it is adding the s in after http?
If i remove wp-load,php it works fine.
There's a chance server is programmed to redirect all http requests to https. You have to change server (adrianmatthewstherapy) configuration to allow http request and not redirect them.
If website is configured for HTTPS, you might need to change the other links to follow the secure connection. Specially I've observed google chrome (Version 80.0.3987.122) is converting all the internal links (audio src) to https.
A good reading:
https://support.google.com/blogger/answer/6286127?hl=en

Blocked content in https

I have moved my Joomla website from one hoster to another and on the new hoster I get:
Blocked loading mixed active content "http://mywebsite.com/joomla/media/jui/css/bootstrap.css"
I understand the reason: I use https, and browser detects a http call.
But how do I fix this?
You change the source of your https website to point to the https version
If you can't, you can fix it for moden browsers with that http header:
Content-Security-Policy: upgrade-insecure-requests
See https://scotthelme.co.uk/migrating-from-http-to-https-ease-the-pain-with-csp-and-hsts/
Note: to improve security, you should use HSTS. It will redirect http to https directly in the browser, without insecure redirect.
Specifically about joomla:
Did you set
$live_site = 'https://www.your-domain.com';
in your configuration.php file ?
See https://www.joomlart.com/tutorials/joomla-tutorials/how-to-use-ssl-in-a-joomla-site

Mixed content: page at https was loaded over https but requested an insecure

I'm using Nginx + flask-socketio + aws elb and when the URL is loaded on https I'm getting the following error message which is something related to the Nginx and socket, please help on this,
socket.io.min.js:2 Mixed Content: The page at 'https://localhost/' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://localhost/socket.io/1/?t=1477375737508'. This request has been blocked; the content must be served over HTTPS.d.handshake # socket.io.min.js:2
socket.io.min.js:2 XMLHttpRequest cannot load http://localhost/socket.io/1/?t=1477375737508. Failed to start loading.
Take a look into your .js file, make sure that you are using the right ajax URL (//your_site.com/handler, instead of http://your_site.com/handler), for instance:
$.ajax({
url:'//your_site.com/handler',dataType:'json',type:'get',
success: function(data){...},
complete:function(xhr, textStatus){...}
});
Mixed Content is a security policy employed by current browsers, and its goal is to prevent leaking information fetched over "secure" HTTPS to non-secure contexts. Therefore, a site served with HTTPS must use HTTPS or other TLS-enabled protocols to fetch content.
The URI prefix for Websockets over TLS is wss, and for plain Websockets ws. At least Chromium and Firefox consider https+ws mixed content, and deny such setting - therefore wss should be used as the URI prefix in secure/HTTPS contexts instead of ws.

Google Analytics with HTTPS protocol with mod_pagespeed

I've used the following information to get mod_pagespeed to inject the GA scripts into my pages:
https://developers.google.com/speed/pagespeed/module/filter-insert-ga
Unfortunately we have a reverse proxy setup where the browser requests the page over HTTPS but the server injects the content as HTTP.
Here is the Chrome browser error:
[blocked] The page at 'https://*' was loaded over HTTPS, but ran
insecure content from 'http://www.google-analytics.com/ga.js': this
content should also be loaded over HTTPS.
I need this module to use the correct protocol when injecting the script i.e. https:// www.google-analytics.com/ga.js (Sorry for the broken URL I can't post more than 2 links)
We don't have an answer yet, but you can track progress of this bug here: https://code.google.com/p/modpagespeed/issues/detail?id=877
You are going to run into this issue a lot. Try fixing the proxy/server so it correctly identifies the end-user connection as SSL. Most Load Balancers inject a header and have an apache mod to read the header for you.

HTTP iframe on HTTPS page

I have a simple question, but can't find the answer that I'm looking for.
Is a http iframe that's loaded on a secure https page also secured?
A iframe with http source will not be displayed on a https website as it's considered mixed content and browsers like Chrome will block the content with the following message:
Mixed Content: The page at 'your website' was loaded over HTTPS,
but requested an insecure resource 'iframe http source '. This
request has been blocked; the content must be served over HTTPS.
So far I have not seen a solution to allow mixed content.
There has been a solution for Firefox which is based on redirecting the iframe source via another website that is hosted on the HTTPS Domain.
It is not automatically, you should verify if the src of your iframe is connecting via https or not:
<iframe src="http://www.example.com"></iframe>
your iframe doesn't extend the https access from principal page.

Resources