Most browsers have a policy that does not allow JSON to be returned from a server in another domain. This "cross-domain" policy make it impossible to receive ordinary JSON from a different server than the one requesting it.
Enter JSONP. It gets its name from (JSON with Padding) because the JSON response object is returned from the server as if it were an argument to a callback function.
jQuery handles JSONP processing and is very easy to work with in this regard.
Here is a simple web page that includes JSONP processing using jQuery:
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<script type="text/javascript" src="/scripts/jquery-3.2.1.min.js"></script>
<title></title>
</head>
<body>
<h1>Website</h1>
<div id="results"></div>
<script>
$(function () {
var url = "https://jsonplaceholder.typicode.com/users";
url += "?callback=?";
$.getJSON(url, function(data) {
var output = "";
$.each(data, function (i, obj) {
output += "<p>" + obj.name + "</p>";
});
$("#results").append(output);
});
});
</script>
</body>
</html>
This uses a call to the website jsonplaceholder.typicode.com which exists for the sole purpose of testing json/ajax calls.