我是有关Ionic Apps的新手,正在http:// localhost:8100上运行我的离子服务器。我的应用程序需要用户当前位置。我添加了这个
<script src="http://maps.google.com/maps/api/js?key=AIzaSyB16sGmIekuGIvYOfNoW9T44377IU2d2Es"></script>
在index.html中
我的app.js有
var options = {
enableHighAccuracy: true
};
navigator.geolocation.getCurrentPosition(function(pos) {
$scope.position = new google.maps.LatLng(pos.coords.latitude, pos.coords.longitude);
console.log(JSON.stringify($scope.position));
},
function(error) {
alert('Unable to get location: ' + error.message);
}, options);
并在config.xml中添加了以下内容
<allow-navigation href="*://*.googleapis.com/*"/>
我在$ scope.position中获得了当前位置。但是问题出在尝试在移动设备上运行我的应用程序时。因此,我已将ubuntu连接到IP-192.168.43.86的移动热点。我尝试使用以下命令在http://192.168.43.86:8100上运行我的离子服务
ionic serve --address 192.168.43.86
现在,上面的getCurrentPosition函数返回错误,指出仅允许使用受保护的来源。所以,我不确定那里发生了什么。localhost和192.168.43.86都是http服务器。但是在本地主机上运行服务器没有问题。但是更改地址将返回错误。我想念什么吗?有人可以帮忙吗?
首先,请确保已在Google Developer Console中将用于访问maps API的IP地址列入了白名单。当您在本机设备(尤其是iOS)上运行时,还需要包含cordova-plugin-whitelist
,以便将不安全的来源明确列入白名单。这是我用于开发的meta标记的示例,它位于<head>
index.html的标记中:
<meta http-equiv="Content-Security-Policy" content="default-src 'unsafe-inline' 'unsafe-eval' 'self' data: gap: *;">
您可以在此处了解有关cordova白名单插件的更多信息。
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句