为什么我在本地主机上的 Chrome 中收到 getCurrentPosition() 和 watchPosition()“不安全的来源”错误？答案

【问题标题】：Why do I get a getCurrentPosition() and watchPosition() "insecure origins" error in Chrome on localhost?为什么我在本地主机上的 Chrome 中收到 getCurrentPosition() 和 watchPosition()“不安全的来源”错误？
【发布时间】：2017-10-30 09:03:03
【问题描述】：

我正在本地开发环境 (Ubuntu 16.04) 中开发一个网站，并通过 http://localhost.example/ 在 Chrome (58) 上测试该网站 - 它连接到本地 Web 服务器。

运行这个 Javascript：

$(document).ready(function() {
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(showPosition);
    }
});

触发此错误：

[弃用] getCurrentPosition() 和 watchPosition() 不再起作用关于不安全的起源。要使用此功能，您应该考虑将您的应用程序切换到安全源，例如 HTTPS。看 https://sites.google.com/a/chromium.org/dev/Home/chromium-security/deprecating-powerful-features-on-insecure-origins了解更多详情。

这是为什么呢？我了解面向公众的网站需要运行 HTTPS 才能使地理定位库/功能正常工作。我们有许多通过 HTTPS 运行类似代码的公共网站。

不过根据depreciation documentation：

localhost 被视为 HTTP 上的安全源，所以如果你能要从 localhost 运行您的服务器，您应该能够测试该服务器上的功能。

上面的 Javascript 在通过 http://localhost.example/test-page/ 加载的 HTML 正文中内联运行 - 那么为什么我在 Chrome 中收到“不安全的来源”错误？

Firefox (53) 按预期显示浏览器访问位置提示。

【问题讨论】：

你能在本地机器上使用 https 运行它吗？
可能是因为localhost !== localhost.example
此外，Firefox 55 版也将具有 https 限制 - 在 firefox 中 Locally delivered files such as http://localhost and file:// paths are considered to have been delivered securely. - 因此，它在 fox 中的工作方式与 chrum 相同
@JaromandaX - 我可以确认localhost/test-page 有效。如果您想将其添加为答案，我将选择正确。

标签： javascript google-chrome geolocation google-geolocation

【解决方案1】：

Chrome 认为 localhost over http 是安全的。当您通过 http 使用 hostnme localhost.example 时，这不被认为是安全的。

注意：Firefox 的行为与 Firefox 55 类似

【讨论】：

有什么方法可以测试吗？
测试什么？这在浏览器中已经事情了很长时间

【解决方案2】：

SSL over HTTP 协议确保客户端和服务器之间的私密通信。信息可能在传输时通过专用网络传输。网络上的任何第三方（黑客）都可以窃取该信息。为避免浏览器强制用户使用安全连接。

在本地服务器上，信息不会超出我们的私有本地网络，因为不需要这种安全性。因此，我们可以期望浏览器允许在本地服务器上不使用 SSL 进行地理定位。理想情况下，浏览器开发人员应该跳过对 localhost 和 127.0.0.1 或类似来源的验证。

必须有一些技巧可以避免此类问题，即您可以在本地服务器上安装自签名 SSL 证书，或者您可以编辑 Chrome 配置文件以允许域访问地理位置、网络摄像头等。

有用的链接，

https://sites.google.com/a/chromium.org/dev/Home/chromium-security/deprecating-powerful-features-on-insecure-origins

https://ngrok.com/

【讨论】：