Request wp_remote_get from a dynamic url (not a json file) - wordpress

Question

I'm currently trying to fetch data from an external source (not a Wp site) to a Wp site using the wp_remote_get method.
The site that i want to get data from doesn't have an actual json file to make the call instead they provide this link to make the request (https://fcc-weather-api.glitch.me/api/current?lat=35&lon=139.
I'm using the below code to make the call.
Is there a way to parse the response in php with html elements so i can properly display it on my website?
Any help would be appreciated.
$url = ' https://fcc-weather-api.glitch.me/api/current?lat=35&lon=139';
$request = wp_remote_get( $url );
if(is_wp_error($request)) {
return false;
} else {
$body = $request['body'];
}
echo $body;
$api_response = json_decode( wp_remote_retrieve_body( $response ), true );
The response
{ "coord":{ "lon":159, "lat":35 }, "weather":[ { "id":500, "main":"Rain", "description":"light rain", "icon":"https://cdn.glitch.com/6e8889e5-7a72-48f0-a061-863548450de5%2F10n.png?1499366021399" } ], "base":"stations", "main":{ "temp":22.59, "pressure":1027.45, "humidity":100, "temp_min":22.59, "temp_max":22.59, "sea_level":1027.47, "grnd_level":1027.45 }, "wind":{ "speed":8.12, "deg":246.503 }, "rain":{ "3h":0.45 }, "clouds":{ "all":92 }, "dt":1499521932, "sys":{ "message":0.0034, "sunrise":1499451436, "sunset":1499503246 }, "id":0, "name":"", "cod":200 }

Answer 1

You can use your $api response to display data. check below code. I did not display all data but can be displayed it by the print echo "<pre>"; print_r($api_response); echo "</pre>";
<?php
$url = 'https://fcc-weather-api.glitch.me/api/current?lat=35&lon=139';
$response = wp_remote_get( $url );
if( is_wp_error( $response ) ) {
return false;
} else {
$api_response = json_decode( wp_remote_retrieve_body( $response ), true );
}
?>
<div>
<h1>Weather reports</h1>
<div>
<label>Lattitude - </label> <?php echo $api_response['coord']['lat']; ?>,
<label>Longitude - </label> <?php echo $api_response['coord']['lon']; ?>
</div>
<div>
<h3>Weather</h3>
<label><?php echo $api_response['weather'][0]['main']; ?><img src="<?php echo $api_response['weather'][0]['icon']; ?>"> - <?php echo $api_response['weather'][0]['description']; ?></label>
</div>
<ul>
<li>Temp - <?php echo $api_response['main']['temp']; ?></li>
<li>Feels like - <?php echo $api_response['main']['feels_like']; ?></li>
<li>Temp min - <?php echo $api_response['main']['temp_min']; ?></li>
<li>Temp max - <?php echo $api_response['main']['temp_max']; ?></li>
<li>Pressure - <?php echo $api_response['main']['pressure']; ?></li>
<li>Humidity - <?php echo $api_response['main']['humidity']; ?></li>
</ul>
<div>
<h3>Wind</h3>
<ul>
<li>Speed - <?php echo $api_response['wind']['speed']; ?></li>
<li>Deg - <?php echo $api_response['wind']['deg']; ?></li>
<li>Gust - <?php echo $api_response['wind']['gust']; ?></li>
</ul>
</div>
</div>
The above code displayed something like this. you can modify based on your requirements.

Answer 2

Does this help? You had $response in there - which was never defined.
$url = ' https://fcc-weather-api.glitch.me/api/current?lat=35&lon=139';
$request = wp_remote_get( $url );
if(is_wp_error($request)) {
return false;
} else {
// Returns the $body as object
$body = json_decode(wp_remote_retrieve_body($request));
}
echo '<div class="weather">' . $body->weather[0]->main . '</div>';
echo '<pre>'; print_r( $body ); echo '</pre>';