Question

我有这支笔：https://codepen.io/dteiml/full/PNMwZo，其中包含以下javascript代码：

$('#getWeather').on('click', function() {
navigator.geolocation.getCurrentPosition(success);

function success(pos){
  // get longitude and latitude from the position object passed in
  var lng = pos.coords.longitude;
  var lat = pos.coords.latitude;
  // and presto, we have the device's location!
  console.log("test");
  $('body').html('You appear to be at longitude: ' + lng + ' and latitude: ' + lat);

}

                 });

和html代码：

<button id="getWeather">
Get my location
</button>
<body>
</body>

我从一个有效的人和一个我自己创建的人http://codepen.io/dteiml/full/aNevrE中分配了相同的代码和设置，但这些代码和设置并不起作用。可能是什么问题？

Answer 1

如果你检查了错误控制台，它就会准确地解释出差异是什么：

https vs http

pen.js：3 getCurrentPosition（）和watchPosition（）在不安全的起源上被弃用。要使用此功能，您应该考虑将应用程序切换到安全的来源，例如HTTPS。有关详细信息，请参阅[编辑]。

（很抱歉，由于链接的原因，我无法完全按照给出的答案发布。）

Answer 2

您必须使用https：//而不是http：// google不接受来自http协议的请求。

Answer 3

将您的codepen切换到https://codepen.io/dteiml/full/aNevrE，它应该可以正常工作。

这是警告：

在不安全的情况下，不推荐使用
getCurrentPosition（）和watchPosition（）起源。要使用此功能，您应该考虑切换您的应用程序到安全源，例如HTTPS。

code

Codepen中的相同代码给出了不同的结果

3 个答案: