Develop Reference

HTTPS endpoint request returns as Mixed Content HTTP

I am having issues returning API data from a GET request for a secure HTTPS Strava API endpoint. I use the following jQuery request:
$.get(`https://strava.com/api/v3/athletes/249995/activities?access_token=[access token here]/`, function(data, status) {
console.log(data[0].name);
}, 'json');
I expect the data to be returned, but instead I'm getting a Mixed Content error:
Mixed Content: The page at 'https://mitchellgsides.github.io/Strava-PR-Lister/' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://www.strava.com/api/v3/athletes/249995/activities?access_token=[access token here]'. This request has been blocked; the content must be served over HTTPS.
I can follow the exact requested link:
https://strava.com/api/v3/athletes/{id}/activities?access_token={accesstoken}/
with no issues, and the result shows as a secure HTTPS with what I want, but my app won't load the content. How can I get rid of the mixed content error, when that error shouldn't apply because the content IS served over HTTPS?

I've solved it! Since I didn't specify 'www.' in my request, the request was redirected as HTTP. In order to avoid redirection, I've made the request identical, like this:
https://www.strava.com/...
instead of
https://strava.com/...

Trying to retrieve JSONP from HTTP server from a HTTPS website

I have a website based on HTTPS, and I have a JS code the get data from a website based on HTTP. I get an error that the HTTP server is not trusted.
While the same code works on HTTP to HTTP. But not on HTTP to HTTPS.
This is the error:
Mixed Content: The page at 'https://www.33k.com/player/playerudan.php' was loaded over HTTPS, but requested an insecure script 'http://33k.thepuremix.net/json.xsl'. This request has been blocked; the content must be served over HTTPS.
For getting this data I use something like the following code:
var URL = "http://33k.thepuremix.net/json.xsl"
$.getJSON( URL, function( data) {
console.log( data );
});
Any idea how to fix it or make it working. Is there such a Crossdomain.xml on Icecast that I can give configure or anything else to fix it?
UPDATE:
The above links are two different websites. It is not a sub-domain matter. The links just look alike a bit. Domain A(HTTPS) wants to get JSON from domain B (HTTP).

Calling HTTP from HTTPS is blocked by design as #RoryMcCrossan mentioned in the comments (Same Origin Policy), you can either move your script from HTTP to HTTPS or make a backend script (in PHP for example) and call HTTP from it like:
JavaScript(HTTPS) -> PHP(HTTPS) -> PHP(HTTP)
JavaScript(HTTPS) <- PHP(HTTPS) <- PHP(HTTP)
Reference to creating a http request in PHP: Http Request in PHP
Here's also some info about Same Origin Policy

link requested an insecure XMLHttpRequest endpoint

I am pretty new to SSL / https but finally managed to create one for my website
https://thaihome.co.uk
Now the problem is this strange error:
app.7e27c5b6c47cfaa5a0da.js:70 error occured for getting the country from: http://freegeoip.net/json/ {data: null, status: -1, config: {…}, statusText: "", headers: ƒ}
app.7e27c5b6c47cfaa5a0da.js:70 Mixed Content: The page at 'https://thaihome.co.uk/' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://freegeoip.net/json/'. This request has been blocked; the content must be served over HTTPS.
And its spitting out the error so fast that the browser almost dies.
What does this mean? and what can I do about fixing it?

The error message explains it pretty clearly and tells you exactly what you need to do to fix it.
Mixed Content
You are mixing content (from HTTPS and HTTP).
The page at 'https://thaihome.co.uk/'
This is your page.
was loaded over HTTPS
You said you set it up for HTTPS. It is HTTPS now.
but requested an insecure XMLHttpRequest endpoint 'http://freegeoip.net/json/'.
And you have some JavaScript which is making an HTTP request using the XMLHttpRequest object.
The URL you are requesting is http://freegeoip.net/json/ which isn't secure. i.e. it uses HTTP not HTTPS. You can tell because it starts http:.
This request has been blocked;
Because it is insecure, it has been blocked. Otherwise it would inject insecure content into an otherwise secure page. The page wouldn't be secure any more.
the content must be served over HTTPS.
You need to load it over HTTPS so it is secure before you can load it from your HTTPS page.

It means you need to make the API request to https://freegeoip.net/json instead of http://freegeoip.net/json
Edit: When you enable SSL on your website, all assets and requests must be made to secure endpoints. Meaning even if you have an image tag that has an unsecured image link going to http like this: <img src="http://unsecure.com/img.jpeg" /> your browser will not give you the green lock secure symbol. Everything needs to be done over https.

error int the Failed to set referrer policy

I'm getting the following error in my chrome console for a Wordpress site I'm working on.
Failed to set referrer policy: The
value 'http://example.com/comic/' is not one of 'always', 'default',
'never', 'no-referrer', 'no-referrer-when-downgrade', 'origin',
'origin-when-crossorigin', or 'unsafe-url'. The referrer policy has
been left unchanged.
It's reffereing to this line in the <head> of the HTML document...
<meta name="Referrer" content="http://example.com/comic/" />
I'm vieing the page over http, not https.
What is causing this issue and how can I fix it?

Go into your .htaccess file and change the following:
Header set Referrer-Policy ""
to
Header set Referrer-Policy "origin"
That should fix the issue.
The reason is more than likely because you don’t have correct permissions on your .htaccess file that allows w3tc to make the changes it needs to.

Here 's the definition taken from the specs:
A referrer policy modifies the algorithm used to populate the Referer header when fetching subresources, prefetching, or performing navigations.
Every environment settings object has an algorithm for obtaining a referrer policy, which is used by default for all requests with that environment settings object as their request client.
Therefore Referral policy deals with what information (related to the url) the browser ships to a server to retrieve an external resource.
The options for the content attribute listed in the specs are :
no-referrer which specifies that no referrer information is to be sent along with requests made from a particular request client to any origin. The header will be omitted entirely.
no-referrer-when-downgrade doesn't send Referrer header to non priori authenticated url (if an https url links to an http url no header is sent)
same-origin policy specifies that a full URL, stripped for use as a referrer, is sent as referrer information when making same-origin requests from a particular request client. while Cross-origin requests won't contain referrer information.
origin sends the scheme, host, and port (basically, the subdomain) stripped of the full URL as a referrer, i.e. https://moz.com/example.html would simply send https://moz.com for all.
origin-when-cross-origin sends the format described in origin to cross-origin, while a full stripped URL is sent to same origin requests.
unsafe-url policy specifies that a full URL, stripped for use as a referrer, is sent along with both cross-origin requests and same-origin requests made from a particular request client.
it's unsafe because it will leak origins and paths from TLS-protected resources to insecure origins.
The empty string "" corresponds to no referrer policy, causing a fallback to a referrer policy defined elsewhere, or in the case where no such higher-level policy is available, defaulting to no-referrer-when-downgrade.
always behaves like unsafe-url.

you can manually find and change as following in .htaccess file :
<IfModule mod_headers.c>
Header set Referrer-Policy ""
</IfModule>
to
<IfModule mod_headers.c>
Header set Referrer-Policy "origin"
</IfModule>

Chrome Inspection Console showed me the same Error for my Wordpress sites which have W3 Total Cache installed.
"Failed to set referrer policy: The value '' is not one of 'no-referrer', 'no-referrer-
when-downgrade', 'origin', 'origin-when-cross-origin'"
and I tried to update the .htaccess file as indicated in the above answer. This fixed the Chrome Inspection Console error but it returned a few moments later.
Checking the Dashboard of W3 Total Cache Performance ->Browser Cache-> Referrer Policy-> Directive, this entry was showing blank.
Selecting 'origin' from the dropdown resulted in .htaccess being updated with the same value 'origin'

"Referer" as a header is spelled without the double R. Maybe with the double R, it's matching against a different header than the one you mean.

In my case, www. was missing in the API URL, while www. was present on the form page. Just ensure your API URL has www. if your page has it too.

How can I make an Ajax call to an HTTP time server site from HTTPS?

I'm trying to get the current time from http://timeapi.org/utc/now.json. I'm using the following:
var date;
$.ajax({
dataType: 'jsonp',
url: 'http://timeapi.org/utc/now.json',
success: function (result) {
date = result.dateString;
}
});
The URL is only available as HTTP, but I'm calling it from an HTTPS site. This leads to the error:
'https://myurl.com' was loaded over HTTPS, but requested an insecure script 'http://timeapi.org/utc/now.json?callback=jQuery1122020058229618158618_1466258121249'. This request has been blocked; the content must be served over HTTPS.
The timeapi website does not actually exist as https, so changing the URL to https leads to a new error: http://timeapi.org/utc/now.json
How can I force it to load? There do not seem to be any https web time services, but I imagine there has to be a way in which people on https sites are using external time-keeping services as well.

You can't.
From HTTPS, only HTTPS. From HTTP you can call HTTP and HTTPS.
What you could do is to create an https wrapper (in php or node) in your own webserver and retrieve the value from timeapi.org from there.
Something like this:
<?php
header('Content-Type: application/json');
echo(file_get_contents('http://timeapi.org/utc/now.json'));

You can't make http requests from an https.
It is restricted by same origin policy
The same-origin policy is a critical security mechanism that restricts how a document or script loaded from one origin can interact with a resource from another origin. It helps isolate potentially malicious documents, reducing possible attack vectors.