我可以从网页(而不是服务器）调用谷歌地图方向API吗

Can I call the google maps directions API from a web page (as opposed to a server)?

本文关键字：调用 谷歌地图 方向 API 服务器 网页 我可以      更新时间：2023-09-26

我是一名长期程序员（C、Python、FORTRAN），但这是我第一次涉足javascript和任何web，所以我正在快速学习。

因此，前面的主要问题是：我可以使用笔记本电脑上简单网页的脚本部分的谷歌地图方向API吗？还是需要从服务器调用？

我有一个API密钥，我已经成功地使用了API中被称为函数（Map，Geometry）的部分。我正在尝试使用谷歌地图方向API，据我所知，你必须通过URL和HTTPGET使用它。以下是我的代码构建的示例URL：

https://maps.googleapis.com/maps/api/directions/json?origin=45.0491174%2C-93.46037330000001&目的地=45.48282401917292%2C-93.46037330000001&key="我的钥匙"

如果我把那个URL粘贴到地址栏，它就可以工作了。我收到了一份包含路线信息的文件。如果我在我正在构建的一个简单网页上的脚本部分中执行它，我得到的响应是：

请求的资源上不存在"Access Control Allow Origin"标头。因此，不允许访问源"null"。

我在stackoverflow和网络上的其他地方做了一些搜索，我发现了这个：

http://www.html5rocks.com/en/tutorials/cors/

根据该页面，我检查以确保支持withCredentials，然后将withCredential设置为true。这并没有改变结果。显然，API是有效的，所以我现在想知道我是否必须在web服务器上而不是在简单的网页上这样做，以绕过跨域限制。我希望避免设置服务器，因为这是我个人使用的一次性服务器，但也许我别无选择？

顺便说一句，有人知道为什么API方向是通过URL调用的，而不是像其他许多函数那样作为javascript函数调用的吗？

对于JavaScript，请更好地使用Web->Maps JavaScript API。这帮助我在没有服务器的情况下解决了这个问题。

问题是您的Web Services->Directions API与Web Services->Geolocations API不同，它不提供JS XSS功能，如服务器端access-control-allow-origin: *响应头或JSONP功能。也许这甚至是谷歌的一个bug，因为我觉得很奇怪，一个"Web服务"API服务器允许JS XSS，而另一个不允许。

请参阅https://stackoverflow.com/a/26198407/3069376

要回答主要问题，请选择"是"。你当然可以在你的网页中使用GoogleMapDirectionneneneba API。要让您快速轻松地开始，请单击此链接。然后，

  1. 单击JAVASCRIPT+HTML版本，复制整个代码并将其粘贴到文本编辑器中，然后将其保存为HTML文件。

  2. 启动您自己的本地服务器（如node.js）。不要忘记获取浏览器API密钥，并在Google开发者控制台中设置HTTP refferer（例如http://localhost:4567），否则会出现错误。

  3. 在本地服务器上运行html文件（例如http://localhost:4567/myprojfolder/samplewebfile.html）

您可以使用所有Google Maps JavaScript API示例来完成此操作。如果你对设置node.js服务器很感兴趣，网上有很多资源。

相关文章：