uniapp 微信小程序获取当前位置,并获取当前详细地址
时间: 2024-09-27 16:16:06 浏览: 109
uniApp是一个基于Vue.js的跨平台框架,它允许开发者构建一次代码,发布到微信小程序、H5网页、App Store、安卓App等多个平台上。对于微信小程序,获取用户当前位置并获取详细地址的功能,你可以通过以下步骤实现:
1. **获取用户位置权限**:
首先,在`app.json`文件中设置页面配置,请求“地理位置”权限:
```json
{
"pages": [...],
"permission": {
"scope.geolocation": {}
}
}
```
然后在需要使用的位置页面的`onLoad`生命周期钩子函数里,发起获取地理位置的请求。
2. **调用微信API**:
使用uni-app提供的wx.getLocation API:
```javascript
page({
onLoad: function () {
uni.getLocation({
type: 'gcj02', // 默认为wgs84坐标系,如需兼容iOS可选择'gcj02'
success: function (res) {
let latitude = res.latitude; // 纬度
let longitude = res.longitude; // 经度
getDetailAddress(latitude, longitude); // 调用获取详细地址的函数
},
fail: function (err) {
console.error('获取地理位置失败:', err);
}
});
},
...
})
function getDetailAddress(lat, lon) {
uni.api.request({
url: 'https://api.map.baidu.com/geocoding/v3/?address=' + lat + ',' + lon + '&output=json&ak=your_baidu_ak',
method: 'GET',
data: {},
success: function (res) {
let address = res.result.addressComponent;
console.log('详细地址:', address.province + ' ' + address.city + ' ' + address.district + ', ' + address.street);
},
fail: function (err) {
console.error('获取详细地址失败:', err);
}
});
}
```
`getDetailAddress` 函数会从百度地图API返回详细的地址信息,记得替换`your_baidu_ak`为你的百度地图密钥。
阅读全文