Google reverse Geocode API parsing

Questions about Thunkable
1

Hi folks. I am hoping someone can put me out of my misery. Having searched the forums for advice and found a few relevant posts, I still am unable to process the response from Google API for a reverse Geocode lookup. The app just crashes with no explanation and I cannot work out what I am doing wrong. Any help greatly appreciated.

For brevity’s sake I have included the top section of the response from the Google API call as follows:

{
“plus_code” : {
“compound_code” : “CPFF+5G Saltash, UK”,
“global_code” : “9C2QCPFF+5G”
},
“results” : [
{
“address_components” : [
{
“long_name” : “Junction”,
“short_name” : “Junction”,
“types” : [ “establishment”, “point_of_interest”, “transit_station” ]
},
{
"long_name" : “Notter”,
“short_name” : “Notter”,
“types” : [ “locality”, “political” ]
},
{
“long_name” : “Saltash”,
“short_name” : “Saltash”,
“types” : [ “postal_town” ]
},
{
“long_name” : “Cornwall”,
“short_name” : “Cornwall”,
“types” : [ “administrative_area_level_2”, “political” ]
},
{
“long_name” : “England”,
“short_name” : “England”,
“types” : [ “administrative_area_level_1”, “political” ]
},
{
“long_name” : “United Kingdom”,
“short_name” : “GB”,
“types” : [ “country”, “political” ]
},
{
“long_name” : “PL12 4RP”,
“short_name” : “PL12 4RP”,
“types” : [ “postal_code” ]
}
],
“formatted_address” : “Junction, Notter, Saltash PL12 4RP, UK”,
“geometry” : {
“location” : {
“lat” : 50.424553,
“lng” : -4.275668
},
“location_type” : “GEOMETRIC_CENTER”,
“viewport” : {
“northeast” : {
“lat” : 50.42590198029149,
“lng” : -4.274319019708497
},
“southwest” : {
“lat” : 50.42320401970849,
“lng” : -4.277016980291502
}
}
},
“place_id” : “ChIJCb0VssSRbEgRoguGSPf3iAI”,
“plus_code” : {
“compound_code” : “CPFF+RP Saltash, UK”,
“global_code” : “9C2QCPFF+RP”
},
“types” : [ “establishment”, “point_of_interest”, “transit_station” ]
},
{
“address_components” : [
{

My target field is in bold above.

I think the path is as follows:

long_name - 2 - address_components - 1 - results

So I convert the json response to an object and using “get property of object” and “in list get” I attempt to get to my text field populated with the target field from the response from Google API.

This is my block:

image
image2301×431 56.7 KB

I’ve attempted various other approaches as per examples in the forums but they all result in the same outcome.

Can anyone spot what my error is and walk me on to it?

Thanks.

Roger

2

For starters, remove the “(gear) list” blocks. The “In list” blocks are expecting a list block and you’re returning a list from the JSON object so those are redundant. I’m not positive they would cause a problem but I bet they do.

Second, you should always check the value of the green error block. If you remove the blocks I mentioned, does it work? If not, what is the error message you get?

1 Like
3

Thanks for your quick reply Tatiang.

Ok, here’s what I have done so far…

I’ve removed all the get property and list blocks to read the error output of the call to the Google geocoding API as below and it is coming back as “Undefined” in other words, there is no error.

image
image778×274 18.3 KB

Next, I have removed all “gear list” blocks and replaced with “get property of object” blocks as follows:

image
image1820×439 54.3 KB

I then fire up the Web preview and experience exactly the same issue and the app misbehaves and the preview just goes blank.

I’ve used the Thunkable app on the mobile and it also crashes there with this screen shot as a result:

image
image970×1782 65.4 KB

In both instances I am unable to access any other error information… is there a debugging mode that I could use that I have so far not found?

I was quite surprised at your recommendation to remove the list block as this method is one of the methods recommended on Thunkable’s WebAPI help page, specifcally in example 2, I’ll post separately, as a new user I am limited to 3 images per post…

From my research of the forums, there seem to be two methods used, the “list” block method that also uses the “get property of object” block as well that I posted originally and the “get property of object” block only method which I have tried above. Both result in the same outcome.

I can confirm that the WebAPI call works, the problems come when I introduce the parsing related blocks having converted the response from json to object.

Any other insight?

Thanks.

4

The screen shot of Thunkable’s WebAPI help page:

image
image1292×1835 230 KB

5

You misunderstood. The “in list” blocks are necessary. It’s only the “list” blocks with the gear symbol that you need to get rid of.

What url are you using for the API call?

1 Like
6

Ah, my mistake. If I have understood you correctly, annoyingly it still doesn’t work… same result. Screen shot of what I have done below:

image
image2127×414 53 KB

URL for the API call is:

https://maps.googleapis.com/maps/api/geocode/json?latlng=50.4229785,-4.2762218999999995&key=

with my Google API key on the end.

That defintiely works and returns the response. I have pasted it into browser address bar and it works there too and I have captured the resposne pre-json to object conversion and it works.

7

Those blocks are correct. Make sure you are testing it on a mobile device and not in a browser. Some APIs don’t work in a browser. I know you said you had used Thunkable Live before… I’m just making sure.

So if the JSON parsing blocks are correct, the only other thing that could be happening is that you have an incorrect URL above the “Get” block or something else you’re doing with the resulting value you’re getting below the “Get” block. And I know the URL you posted is valid because I was able to get the JSON response in a browser using my own API key. But again, if it’s incorrect in Thunkable (an extra space, a missing character, etc.) then it will crash your app.

One easy way to isolate the problem is to – temporarily – set the value of a label to the green response block. Run the API “Get” block and then just set that label value. Don’t do any parsing. Just check if you can get a response that looks like the JSON you see when visiting the url in a browser. If that works, the problem is with your parsing blocks (and I’m wrong!). If it doesn’t work, then the problem is with your url.

If you’d like, you can share your project link with me in a private message and I can take a look. It’s probably something pretty simple to fix.

8

Thanks again Tatiang.

I am still using Thunkable Live on the mobile to test and it still crashes with the correct blocks.

I have previously isolated the url that I construct to call the API exactly as you have described and copied that straight into a browser to test it works and it does… I have also confirmed that it works in the app pre-JSON converstion and parsing and again, I get the correct response from the server.

I will share a link with you once I work out how to do that as Thunkable is a new environment for me, thanks for taking the time to help me out here.

9

You’re welcome. I think the issue (and I just PM’ed you this) is that the green latitude and longitude blocks are numeric values and you actually need them to be text strings for the API url block.

To fix this, join (use the Join block in the Text drawer) each green block with an empty text block ("").