Polymer: I'm using Google Place API and it does not seem to support CORS

Created on 19 Jul 2014  路  9Comments  路  Source: Polymer/polymer

See http://property.brooklyncoop.org/static/places_autocomplete/place_autocomplete.html
and look in the console.

I see No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://property.brooklyncoop.org' is therefore not allowed access.

If this is true, then how do we request this google api to support a core-ajax polymer request

Can you request this?

Thanks,
Ralph

invalid

Most helpful comment

Hey, Hi guys.
We we are trying to send reqeust using iron-ajax element to openshift servers.
but encountered with error 'Access-Control-Allow-Origin'. Is der any thing which we can do to solve this error.

error

when , i set headers.. again error occurs.
when_set_headers

All 9 comments

Are you still seeing this error? I don't see anything in the console on Chrome 36 beta.

Hi Eric, thanks for looking.

I modified that page to use Apps Script instead of the direct call to maps.google.com

But I restored the original page and issue in a new page, please see http://property.brooklyncoop.org/static/places_autocomplete/place_autocomplete_issue1.html

Again thanks for responding.

screen shot 2014-07-21 at 6 47 40 pm

I see it now, thanks.

This isn't an issue with Polymer, but a requirement of the Places API. That endpoint needs to support CORS for core-ajax to work and the request to succeed. I believe Maps offers the Places API has a service, but to use it in a JS env, you have to use the the Places JS lib: https://developers.google.com/maps/documentation/javascript/places

We do have google-map-search, which should mostly do what you want. Note though, it only returns the first result.

Thanks very much!

Hey, Hi guys.
We we are trying to send reqeust using iron-ajax element to openshift servers.
but encountered with error 'Access-Control-Allow-Origin'. Is der any thing which we can do to solve this error.

error

when , i set headers.. again error occurs.
when_set_headers

Hi Eric,

I am facing the similar error as above - XMLHttpRequest cannot load https://www.my.internalApi/addresslookup/AutocompleteSearch?maxItems=5 No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:5000' is therefore not allowed access.

Is there any work around to fix it from Polymer ? rather than changing it at the endpoint.

It would be great If can I get some assistance.

Thank you
Ashish Pashap

I'm using 'react-native-google-places-autocomplete' and this error occurred when try to find any place.
Access to XMLHttpRequest at 'https://maps.googleapis.com/maps/api/place/autocomplete/json?&input=Cha&key=AIzaSyB1KJcROOPXbXOUGnz422LY5x5MywHc2iM&language=en' from origin 'http://localhost:19001' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

Hi @developweb10,

This issue was closed almost six years ago, and you don't seem to be using Polymer in the first place, so I don't think there's anything we can help you with.

You might start with the react-native-google-places-autocomplete repo.

There's also a support page for the Places API if the issue turns out to not be the react-native-google-places-autocomplete component.

Was this page helpful?
0 / 5 - 0 ratings