谷歌地图 API JavaScript 不在 html 文件中运行，但在 w3schools 中运行

Question

我试图获取我当前的位置并在谷歌地图中显示。 为此：

• 我激活了 Javascript API（在 google.developers 站点中）。
• 获得了访问 api 的密钥。
• 将下面链接中的代码复制到一个 html 文件中（当然，在“调用”api 时插入我的密钥）。

https://developers.google.com/maps/documentation/javascript/examples/map-geolocation

当我在浏览器中运行 html 文件时，我收到了一个警报，给出了错误 InvalidKeyOrUnauthorizedURL，但似乎我做的一切都是正确的，实际上我似乎真的做到了，因为当我运行W3Schools 教程中的确切代码（“自己试试”）结果显示了我的位置。

所以在这种情况下，我想知道为什么我不能直接在浏览器上运行这段代码，我的意思是，使用 w3schools 还可以，但它不是正确的方法，它质疑为什么它是无效的。

观察： 请注意，该文件不是托管的，它是我自己的计算机。 我尝试在 Opera 和 Chrome 浏览器中运行，但都失败了。 我直接在浏览器上成功运行了google maps api的代码，但它们不需要任何密钥。

谢谢

Answer 1

这是因为您没有将其托管在本地服务器上。

即使您允许所有网站跟踪您的位置，您的浏览器也不会允许位置请求通过。

在 localhost 界面上设置一个服务器，然后尝试运行它。它应该工作得很好。

PS。当任何位置请求被阻止时，您的浏览器会告诉您。在 Chrome 中，在发出位置请求后，URL 栏的右侧会出现一个小图标。