javascript 谷歌地图 API v3 地理定位在谷歌浏览器中不起作用
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/19588940/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Google Maps API v3 Geolocation not working in Google Chrome
提问by Tyler
I'm using Google Maps API v3 Geolocation to get the users actual location. I found this post from Google Developers:
我正在使用 Google Maps API v3 Geolocation 来获取用户的实际位置。我从 Google Developers 找到了这篇文章：
https://developers.google.com/maps/documentation/javascript/examples/map-geolocation
https://developers.google.com/maps/documentation/javascript/examples/map-geolocation
Here my code (equals to the code of Google Maps example):
这里我的代码（等于谷歌地图示例的代码）：
<head>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=true"></script>
<script>
// Note: This example requires that you consent to location sharing when
// prompted by your browser. If you see a blank space instead of the map, this
// is probably because you have denied permission for location sharing.
var map;
function initialize() {
var mapOptions = {
zoom: 6,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById('map-canvas'),
mapOptions);
// Try HTML5 geolocation
if(navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function(position) {
var pos = new google.maps.LatLng(position.coords.latitude,
position.coords.longitude);
var infowindow = new google.maps.InfoWindow({
map: map,
position: pos,
content: 'Location found using HTML5.'
});
map.setCenter(pos);
}, function() {
handleNoGeolocation(true);
});
} else {
// Browser doesn't support Geolocation
handleNoGeolocation(false);
}
}
function handleNoGeolocation(errorFlag) {
if (errorFlag) {
var content = 'Error: The Geolocation service failed.';
} else {
var content = 'Error: Your browser doesn\'t support geolocation.';
}
var options = {
map: map,
position: new google.maps.LatLng(60, 105),
content: content
};
var infowindow = new google.maps.InfoWindow(options);
map.setCenter(options.position);
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<div id="container">
<div class="entry-content">
<div class="blogtitle">IT</div><p> </p></td><td> </td><td><p> </p></td></tr></tbody></table><p> </p>
<div id="map-canvas"></div><!-- map-canvas end -->
</div><!-- entry-content end -->
</div><!-- container end -->
</body>
This works quite fine in Firefox but not in Google Chrome & Safari. I think because Chrome & Safari are webkit browsers. But I don't know how to fix it.
这在 Firefox 中非常有效，但在 Google Chrome 和 Safari 中则不然。我认为是因为 Chrome 和 Safari 是 webkit 浏览器。但我不知道如何修复它。
Can someone please help me?
有人可以帮帮我吗？
采纳答案by zitscher
I have found this
我找到了这个
It appears this is a security restriction for the file protocol. Looks like you are going to need to host it locally from a server.
看来这是文件协议的安全限制。看起来您将需要从服务器本地托管它。
I've tested your code with a local server and it just works fine. Hope I could help.
我已经使用本地服务器测试了您的代码，它运行良好。希望我能帮上忙。
回答by tuned
Try to use HTML5 geolocation APIinstead of Google Maps' one for the browsers you are having problems with.
对于您遇到问题的浏览器，尝试使用HTML5 地理定位 API而不是 Google Maps 的API。
You can find the reference here
你可以在这里找到参考
