Google Places Autocomplete 有时不工作 [关闭]

Question

地点自动完成 (javascript) 在很多方面都很奇怪。我的观点是，它在某些浏览器上似乎一直有效，但在其他浏览器上却断断续续。为了到达这里，我不得不做一些与其他建议相反的事情，（尽管“正确”的方法效果更差）所以我有很多东西要列出。

具体问题（在任何浏览器上）是回调 initAutocomplete() 确实完全发生，但有时输入字段不会出现建议。但是，没有记录错误。当它失败时，我发现了两件值得注意的事情：没有创建 pac-container，并且没有为 AutocompletionService.GetPredictions 发送请求。

这些错误似乎从未在 FireFox 或 Edge 上发生过。它大部分时间都发生在 Chrome 上。它永远不会在 iOS Chrome 上运行，但很少在 Safari 上运行......到目前为止，这不是一个有用的模式。

页面上多次调用 Maps API，导致“您已在此页面上多次包含 Google Maps JavaScript API。这可能会导致意外错误。”错误。但是，这似乎没有实际问题，因为调用是针对不同的库（几何和位置）。至少，place 脚本的回调函数绝对总是起作用。

除此之外，没有任何错误报告。值得注意的是，我目前正在附加一个实际上基于会话的会话令牌（对于用户，因此对于多个请求。）这与 stackoverflow.com/a/50452233/5140781 等信息直接相反（我已经搜索了 很多 在发布之前）表示不需要 sessiontoken 并将自动处理。这是相反的，因为不包括它会使服务中断更频繁。如果没有它，它会在 Firefox 和 Edge 上占用大量时间，目前还不错，Chrome 在每个用户会话中只能工作一次，在一次刷新或任何后续形式之后，它肯定不会再工作了。 我还尝试在每个页面加载时附加一个随机会话令牌，但这也无济于事。尽管在所有情况下，错误都是相当随机的，但错误可能与会话令牌无关，而我所看到的一切都只是人类模式寻找和 [坏] 运气。据我所知，这可能只是不同 API 调用的竞争条件。如果我执行“空缓存和硬重新加载”而不仅仅是 F5，我可以让它在 Chrome 上运行得更多；将其添加到它通常在会话中第一次工作，也许您认为从缓存中加载脚本比实际加载时更有可能导致问题？我没有想法，或者至少是我认为合理的想法。

initAutocomplete 的代码几乎与the example 中给出的代码完全相同，只需添加 sessiontoken（同样，如果没有它，它会失败更多）。

任何帮助将不胜感激。

Answer 1

事实上，它是谷歌 API 的双重包含。尽管事实上一个包含库是几何体并且这是地点，并且即使在失败状态下，Place 脚本上的回调也会发生..

只需删除相关页面上包含的几何，即可 100% 修复自动完成功能（我们可以删除 sessiontoken），但页面上的其他功能需要几何。通过将其添加到为 place 库制作的包含中解决了这个问题。只需使用逗号来定位多个库；我没有看到文档中提到过，但很容易猜到：

<script src="https://maps.googleapis.com/maps/api/js?key=********&libraries=places,geometry&callback=initAutocomplete" async defer></script>

现在，如果您需要的几何图形（或任何其他库）比您所在的位置更高且更快，这是我没有遇到的一个新问题。但是对于任何发现这一点的人，我最简单的建议是将整个自动完成块移到那里并以相同的方式组合包含。然后有 2 个可能的问题：另一个脚本已经有回调，并且表单可能还不存在。

如果只有第一点是您的问题，则可以简单地组合回调；只需执行其他回调代码，然后执行自动完成。对于第二个，有两个选择：首先，如果您可以让您的表单出现触发一个事件，然后让回调为其设置一个监听器，然后将其设置为通常的（注意表单可能首先加载！）。其次，一个 setInterval 检查元素是否存在并在找到时执行工作（并停止检查）——这很脏，但仅适用于 vanilla js；如果您拥有任何框架，可能会有更好的选择。如果你有这两个问题，只需在回调开始时设置监听器/间隔。