How to fetch a url from my text element with axios

Ask us anything
1

Hello everyone, I am creating a job search page, my db is being fetched from Xano… when I enter the detail page of a job I want to do a fetch with axios to an api similar to google maps that returns the name of a location based on longitude and latitude in the job info. This is my case:

async function getLocationName(lat, lon) {
try {
const response = await axios.get(https://nominatim.openstreetmap.org/reverse?format=geojson&lat=${lat}&lon=${lon});

if (response.data) {
  
  const location = await response.data.features[0].properties.display_name; //Full location name
  return location;

} else {
  return "Location not found.";
}

} catch (error) {
console.error(“Internal error:”, error);
throw error;
}
}

//
const lat = variables[/* Selected Job /‘a75e0565-7510-4611-a817-2f74ac0c3368’]?.[‘location’]?.[‘data’]?.[‘lat’];
const lon = variables[/ Selected Job */‘a75e0565-7510-4611-a817-2f74ac0c3368’]?.[‘location’]?.[‘data’]?.[‘lng’];

getLocationName(lat, lon)
.then((location) => {
return location;
})
.catch((error) => {
console.error(“Error:”, error);
});

But this function doesnt execute and just return ‘undefined’

I would really appreciate your help, thank you

2

you need to await the result of the async function. It’s the same thing as this post

3

Thanks but my case is not applied from a workflow. I want the fetch to be done directly when the user enters that page… I already tried several times using my code in vsc and it works but for some reason it doesn’t work here

4

I just told you why it doesn’t work: you need to await the async function. The linked post has resources where you can learn about working with promises in js, it’s useful to understand what are you doing.