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

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.

Related

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.

Access-Control-Allow-Origin in Google Safe Browsing API

I have a script which I give to my clients and they put it in their web pages.
I want to check inside that script if the domain is safe using Google's Safe Browsing API.
When the script loads, I make an API request for the current domain with the client key I got from Google.
"Client key" according to Google:
API requests are sent directly to Google from your clients' browsers
$.ajax({
url: "https://sb-ssl.google.com/safebrowsing/api/lookup?client=demo-app&key=AIzaSyBx5EyJlhg-oB4inoO15fMlP37ljeDP98o&appver=1.5.2&pver=3.1&url=http%3A%2F%2Fstackoverflow.com",
method: "GET",
success: function (result) {
self.onDataReceived(result);
}
});
But the browser blocks my request due to No 'Access-Control-Allow-Origin' header is present on the requested resource.
It appears that the Safe Browsing API does not support cross origin requests and your best option is running a proxy on your domain.

Adobe Connect API with Jquery

I am trying to create a simple login form for my Adobe Connect account, however it's not working, I'm getting the error:
No 'Access-Control-Allow-Origin' header
However I'm doing other Ajax calls just fine on my machine.
Here's some example code that I'm using.
var request $.ajax({
url: 'http://example.com/api/xml?action=login&login=' + username + '&password=' + password
type: "GET"
});
request.done(function(){
...
})
Does anyone have any suggestions?
Your local machine calls are working because you're making calls inside the same domain. As soon as you try to do ajax calls to something outside the bounds of the caller's domain you'll run into issues with the browser's Same-Origin policy.
Basically it's a security policy that allows scripts to run on pages originating from the same site (comprised by the combination between schema, hostname and port. eg. mysite != mysite:8080) So if you have an ajax call executed from a site running on mysite to a site running on mysite:8080, the browser will consider this a same-origin policy hence blocking that request.
You should read about CORS (Cross-Origin Resource Sharing) in order to find options to help you relax the same-origin policy.

Ajax GET request over HTTPS

How can I send an ajax GET request over HTTPS?
$.get throws this:
XMLHttpRequest cannot load https://********. Origin null is not allowed by Access-Control-Allow-Origin.
Is there another way or some workaround to get this working?
If I navigate to the url with Chrome I'm able to get the response. I see no reason why it shouldn't work work over an ajax request.
You cannot make an AJAX request to an https page if you are currently in http because of the Same Origin Policy.
The host, port and scheme (protocol) must be the same in order for the AJAX request to work.
You can either make sure that the originating page is on the same host and scheme or implement CORS (cross-origin resource sharing) on the target domain to permit this particular request.
[jQuery v. 3.3.1]
I have a web application, where all resources and traffic are via HTTPS.
Yet, I found that I can't send $.ajax() or any of the specific $.get, $.post, etc. due to (Chrome output):
Refused to connect to 'http://mywebapp/api/mycall' because it violates the following Content Security Policy directive: "connect-src 'self'".
It was due to the HTTPS page making the AJAX requests through HTTP and I found no way to force HTTPS.
What is crazy is what fixed it. Calling $.get('/api/mycall/') outputs the above error with "Refused to connect to 'http://mywebapp/api/mycall'", which omits the ending forward slash in the actual call in the code. So from the error it looks as if the forward slash wasn't there.
I have done multiple calls and every single one fails when there is an ending slash in the url being called. The same ones all succeed without one.
So calling $.ajax({ url: '/api/mycall'}) works, whilst $.ajax({ url: '/api/mycall/'}) doesn't.

Categories

Resources