0

I am working on integrate Google Maps API to build an autocomplete feature to a textfield in my website.

So i wrote the below function which makes an API call to Google APIs and get the locations. 

   get_data = function(word, callback){
            var google_api = "https://maps.googleapis.com/maps/api/place/autocomplete/json?input="+word+"&types=geocode&
key=AIzaSyCkvES-57OzaaqwnkVb74PwBqjxRbtsNNQ";   
            console.log(google_api);    
            $.ajax({
                url: google_api, 
                type: "GET",   
                dataType: 'jsonp',
                cache: false,
                success: function(response){  
                    console.log(response);                     
                    callback(response);                   
                }           
            }); }

If I paste the URL generated ( google_api) into a browser bar, it works fine. But the JSONP request as above fails with the below error showing in the browser console. Any ideas on where I am wrong ?

Uncaught SyntaxError: Unexpected token :json?input=cvcxvxcxfdf&types=geocode&key=AIzaSyCkvES-57OzaaqwnkVb74PwBqjxRbtsNNQ&callback=jQuery111…:2

An example of the URL generated is below ( which works well on its own)- https://maps.googleapis.com/maps/api/place/autocomplete/json?input=del&types=geocode&key=AIzaSyCkvES-57OzaaqwnkVb74PwBqjxRbtsNNQ

geeky_monster
  • 8,672
  • 18
  • 55
  • 86
  • The response is JSON, not JSONP. – Quentin Jun 23 '16 at 10:36
  • 1
    That endpoint returns JSON, not JSONP, hence the error. I'm assuming then, that you changed it to JSONP in an attempt to avoid the Same Origin Policy, however that only works if the server response is in the right format. – Rory McCrossan Jun 23 '16 at 10:36
  • If I use replace JSONP, I get a CORS error. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3000' is therefore not allowed access. – geeky_monster Jun 23 '16 at 10:38
  • That means the URL you're calling refuses third party requests. See [this question](http://stackoverflow.com/questions/3076414/ways-to-circumvent-the-same-origin-policy) for solutions to that problem – Rory McCrossan Jun 23 '16 at 10:41

0 Answers0