如何使用角度应用程序从谷歌api附近的搜索获取一个地方的图像？

Question

我正在使用google places api，我正在尝试获取附近搜索地点的图片。我尝试了几种变体，似乎文档不对，或者我做的事情显然不是错误的。

我试过这个。

 let request2 = {
      key: this.apiKey.getStandardGoogleKey(),
      placeId:"place_id_to_be_used"
    };

    service.getDetails(request2, (results, status )=> this.callback2(results, status));
  }

  callback2(results, status){
    console.log(results);
  }

我得到了这个结果

根据文档，照片数组应该包含photo_reference，以便我可以访问图像，但事实并非如此。

我也尝试过使用angular的http请求直接访问api 使用这个

https://maps.googleapis.com/maps/api/place/nearbysearch/output?parameters

当我从邮递员那里做到这一点时，我得到了photo_reference。但是，当我从我的角度应用程序执行此操作时，我收到CORS错误，看起来像这样。

我可以通过向chrome添加插件来解决此问题，但生产服务器上会返回错误。

我的问题是。如何从google地方api或其他谷歌api获取photo_refence以获取胎盘或从附近搜索中检索到的其他值？

Answer 1

function ParseJSON(MyObject) { // parse incoming var into a JSON object. var MyObjectParsed= JSON.parse(MyObject); var i = 0; var NewJSONstring = "{/"Results/": {/"NewId/":"; // for each profile for(;MyObjectParsed.digital-profiles[i];) { NewJSONstring = NewJSONstring+ MyObjectParsed.digital-profiles[i].Id; NewJSONstring = NewJSONstring+ ':'; NewJSONstring = NewJSONstring+ MyObjectParsed.digital-profiles[i].status; NewJSONstring = NewJSONstring+ ','; i++ } return NewJSONstring; 属性显示在Places API web service的响应中。正如您所提到的，由于same-origin policy的Web浏览器会导致CORS错误，因此无法直接从客户端JavaScript代码调用Web服务。

查看截图，我会说您在代码中使用的库使用Maps JavaScript API的地方服务。所以你调用PlacesService的photo_reference方法：

https://developers.google.com/maps/documentation/javascript/reference#PlacesService

回调函数接收PlaceResult对象：

https://developers.google.com/maps/documentation/javascript/reference#PlaceResult

场所结果包含一组PlacePhoto对象：

https://developers.google.com/maps/documentation/javascript/reference#PlacePhoto

正如您所看到的，PlacePhoto对象具有getDetails()方法：

  

返回与指定选项对应的图像URL。您必须包含一个PhotoOptions对象，其中至少指定了maxWidth或maxHeight之一。

使用此方法，您将获得地方照片的网址。

我希望这有帮助！