JavaScript访问Google Places API的CORS问题

时间:2018-08-30 13:07:57

标签: google-maps

尝试使用带有标头的多个组合对google maps Places API进行ajax jQuery调用以获得预测。

我收到以下错误:

  

无法加载https://maps.googleapis.com/maps/api/place/autocomplete/json?input=Amsterdam&types=geocode&key=AIzaSyBqYrYm377wh0pgINHBQfadjCokJkj_uVQ&_=1535634162773

     

对预检请求的响应未通过访问控制检查:所请求的资源上不存在“ Access-Control-Allow-Origin”标头。   因此,不允许访问来源“ https://stackoverflow.com”。

在控制台中执行以下代码时(URL中没有API密钥):

jQuery.ajax({
    type: 'GET',
    url: "https://maps.googleapis.com/maps/api/place/autocomplete/json?input=Amsterdam&types=geocode&key={API Key Here}",
    contentType: "application/json",
    dataType: 'json',
    "crossDomain": true,
    headers: {
        'Access-Control-Allow-Headers': 'Content-Type, Content-Range, Content-Disposition, Content-Description, x-requested-with, x-requested-by',
        "accept": "application/json",
        "Access-Control-Allow-Origin":"*"
    },
    success: postSuccess,
    error: postError,
});
function postSuccess(result,status,xhr) {
    console.log("postSuccess");
}
function postError(xhr,status,error) {
    console.log("postError", xhr,status,error);
}

如果有人可以将我指向解决方案,那将是很棒的事情。

编辑:在问类似问题之前搜索了类似问题,发现this,但解决方案没有帮助。

Edit2:更具体地说,我想从JavaScript中的Places API检索JSON结果:https://maps.googleapis.com/maps/api/place/autocomplete/json?input=Amsterdam&types=geocode&key={API Key Here}

1 个答案:

答案 0 :(得分:2)

要通过javascript访问places API,请使用Google Maps Javascript API v3 places library