Say I have a PHP script that retrieves JSON data for me:
<?php
header('Content-Type:application/json; charset=utf-8');
$url = "http://ipinfo.io/" . $_SERVER['REMOTE_ADDR'] . "/json";
echo file_get_contents($url);
How do I parse this data in JavaScript?
So, looking at a data sample, we see that the URL:
http://ipinfo.io/104.111.103.12/json
Shows:
{
"ip": "104.111.103.12",
"hostname": "a104-111-103-12.deploy.static.akamaitechnologies.com",
"city": "Cambridge",
"region": "Massachusetts",
"country": "US",
"loc": "42.3626,-71.0843",
"org": "AS35994 Akamai Technologies, Inc.",
"postal": "02142"
}
Therefore:
<?php
$sIP = $_SERVER['REMOTE_ADDR'];
if ($sIP == '127.0.0.1') { // like testing at home on your own workstation
$sIP = '104.111.103.12'; // use a dummy one just for this demo
}
$sURL = "http://ipinfo.io/" .$sIP . "/json";
$sJSON = file_get_contents($sURL);
$view = (object) array();
$view->JSON = $sJSON;
?><!DOCTYPE html>
<html>
<head>
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
</head>
<body>
<script type="text/javascript">
// global string of Data
var gsData = <?= $view->JSON ?>
$(document).ready(function(){
var sRegion = gsData.region;
$('#result').html(sRegion);
});
</script>
<div>Region from data is:</div>
<div id="result"></div>
</body>
</html>
...Shows this result on my home workstation webserver (which currently has IP 127.0.0.1):
Region from data is:
Massachusetts
Now, what you'll want to do, however, is never trust data. Let's say a hacker overtakes ipinfo.io and the JSON no longer becomes JSON, but something malicious. It then means that it can insert malicious code into your website from the client browser side, such as defacing the website or making it redirect to some very bad site full of malware.
There may also be a potential exploit (I'm not certain) at the point that PHP injects data into the HTML through the web server before it is sent to the client browser. There may be a weakness in the web server (again, not certain) where a buffer overrun could be done there, and then it can inject code into the web server such as causing it to create files that can then be executed remotely.
So, there are many articles on the web for how to polish and test data first before it is sent to the browser. That's beyond the scope of your question, but an extremely important point to remember.
Here's some information on how to validate JSON from PHP:
JSON = $sJSON; ?> Region from data is:. Does the PHP code have to be right above the HTML? I'm testing it via localhost. Does it have to stay on a real webserver?
<?php
$REMOTE_ADDR = "104.111.103.12";
$url = "http://ipinfo.io/" . $REMOTE_ADDR . "/json";
$data = file_get_contents($url);
?>
<!doctype html>
<script>
var data = <?php echo $data; ?>;
alert(data.ip);
</script>
