时间戳

首页 > 解决方案 > 如何使用 google 地方和 javascript API 循环浏览其他页面？

javascript - 如何使用 google 地方和 javascript API 循环浏览其他页面？

问题描述

我正在构建一个单页应用程序，并使用前端 javascript API 来访问谷歌地图和地点。我成功地生成了谷歌地图并通过此 api 获取机构详细信息，但是，javascript API 不返回允许我在前 20 个之后搜索其他结果的“next_page_token”。

您如何使用 javascript API 来获取 next_page_token 以遍历多页结果？我很绝望，因为我在任何地方都找不到有关此的任何信息。

编辑 - 包括一些附加信息。

使用Google 在此处提供的文档进行附近搜索只会返回一组 20 个结果，响应中没有其他属性。

这是我使用 Javascript API 发出的请求。我的 index.html 文件中包含该脚本。

let map = new google.maps.Map(this.$refs.map, {
    center: this.location,
    zoom: 12,
    disableDefaultUI: true,
    scrollwheel: false
})

let request = {
    location: this.location,
  radius: 10000,
  type: ['restaurants'] 
}

let service = new google.maps.places.PlacesService(map)
service.nearbySearch(request, (results, status) => {
    console.log("Results", results)
    console.log("Status", status)
})

这是谷歌发回的内容。从开发工具中的控制台获取。

Results (20) [{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}]

来自 nearSearch 的结果请求第三个参数。

a4 {f: ƒ, b: ƒ, l: "CqQCIAEAAPcNpixD40jA39VnP-WMOZT21nGCcfpK_smpYhG66W…UWk72OjPB1A7Mdudz6UhoUD_vqC-QSk7CKnoveUXK0IHnQ8es", j: 1528768999850, hasNextPage: true}

标签： javascriptgoogle-apigoogle-places-api

解决方案

来自谷歌页面搜索 API

访问其他结果：

默认情况下，每个附近搜索或文本搜索每个查询最多返回 20 个建立结果；但是，每次搜索最多可以返回 60 个结果，分成三个页面。如果您的搜索将返回超过 20 个，则搜索响应将包含一个附加值 — next_page_token。将 next_page_token 的值传递给新搜索的 pagetoken 参数以查看下一组结果。如果 next_page_token 为 null 或未返回，则没有进一步的结果。从发出 next_page_token 到它生效之间有短暂的延迟。在下一页可用之前请求下一页将返回 INVALID_REQUEST 响应。使用相同的 next_page_token 重试请求将返回下一页结果

因此，简而言之，来自如下电话的响应： https ://maps.googleapis.com/maps/api/place/textsearch/xml?query=restaurants+in+Sydney&key=YOUR_API_KEY

-或者-

https://maps.googleapis.com/maps/api/place/nearbysearch/json?location=-33.8670522,151.1957362&rankby=distance&type=food&key=YOUR_API_KEY

你会找到：

{
   "html_attributions" : [],
   "next_page_token" : "CpQCAgEAAFxg8o-eU7_uKn7Yqjana-HQIx1hr5BrT4zBaEko29ANsXtp9mrqN0yrKWhf-y2PUpHRLQb1GT-mtxNcXou8TwkXhi1Jbk-ReY7oulyuvKSQrw1lgJElggGlo0d6indiH1U-tDwquw4tU_UXoQ_sj8OBo8XBUuWjuuFShqmLMP-0W59Vr6CaXdLrF8M3wFR4dUUhSf5UC4QCLaOMVP92lyh0OdtF_m_9Dt7lz-Wniod9zDrHeDsz_by570K3jL1VuDKTl_U1cJ0mzz_zDHGfOUf7VU1kVIs1WnM9SGvnm8YZURLTtMLMWx8-doGUE56Af_VfKjGDYW361OOIj9GmkyCFtaoCmTMIr5kgyeUSnB-IEhDlzujVrV6O9Mt7N4DagR6RGhT3g1viYLS4kO5YindU6dm3GIof1Q",
   "results" : [{...}]
}

重要提示：如果没有要显示的其他结果，则不会返回 next_page_token。可以返回的最大结果数为 60。在发出 next_page_token 和它变为有效之间有短暂的延迟。

阅读更多： https ://developers.google.com/places/web-service/search#PlaceSearchPaging

推荐阅读