Long story short, I'm trying to use Google Places API in order to get sights based on latitude and longitude. When I tried to use that API for the first time, I tried using axios on the front end to make a GET request like this:
axios.get('https://maps.googleapis.com/maps/api/place/nearbysearch/json?location=42.150527,24.746477&radius=1500&type=art_gallery&key=')
.then(response => {
console.log(response)
})
However, I kept getting a CORS error:
"has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is
present on the requested resource."
So I was wondering what am I doing wrong and decided to recheck the documentation and found this:
"Each of the services is accessed as an HTTP request, and returns either an JSON or
XML response. All requests to a Places service must use the https:// protocol, and
include an API key."
So after consulting stackoverflow, I was told that the request must come from a back end server and not a browser. It was explained to me that my server must make a request to Google Places API and then my front end must make a request to my server so that I could get the sights information.
I do have a PHP/Laravel back end used for storing users, latitude and longitude markers and locations, however, I have no idea how to make that request from my server to the Google Places API.
This is my first time using APIs that require such requisite. So far I've only made my own APIs using PHP and Laravel which have endpoints that return information.
What I'm trying to say it that I have absolutely no idea how to make my server make a request to the Google Places API.
Any information, explanations and documentation related to my problem would be really appreciated.