uniapp的h5定位不准

1. 问题描述

在使用uniapp开发h5应用时，经常会出现定位不准的情况，甚至会出现定位偏移的现象，严重影响了应用的使用体验。

2. 问题原因

在uniapp中，由于不同的浏览器对于定位API的支持情况不同，导致了定位不准的问题。

uniapp是基于vue实现的，其中使用了js的navigator.geolocation对象进行定位。而每个浏览器支持的定位方式是不同的，部分浏览器可能不支持某些定位方式或支持的定位方式效果不够准确，所以会出现定位问题。

3. 解决方法

3.1 检查定位权限

在使用定位功能前，需要先检查用户是否授权了定位权限。如果没有授权，则需要提示用户授权。

代码实现如下：

// 检查定位权限
uni.getSetting({
  success: function (res) {
    if (!res.authSetting['scope.userLocation']) {
      uni.showModal({
        title: '提示',
        content: '请授权地理位置权限',
        success: function (res) {
          if (res.confirm) {
            uni.openSetting({
              success: function (res) { }
            })
          }
        }
      })
    }
  }
})

以上代码中，首先使用uni.getSetting()方法获取用户的授权情况，判断是否授权，如果没有授权，则使用uni.showModal()方法提示用户授权，并使用uni.openSetting()方法打开设置页面，让用户进行授权。

3.2 使用较准确的定位方式

如果浏览器支持多种定位方式，可以使用较准确的方式进行定位。

代码实现如下：

// 使用较准确的定位方式
uni.getLocation({
  type: 'gcj02',
  success: function (res) {
    console.log(res)
  },
  fail: function (res) {
    console.log(res)
  }
});

以上代码中，使用uni.getLocation()方法，参数type为`gcj02`，表示使用国测局坐标系，该坐标系在中国较为常用。

3.3 调整定位精度

在uniapp中，可以通过配置vue.config.js文件中的devServer属性来修改定位精度。

代码实现如下：

// 修改定位精度
module.exports = {
  devServer: {
    proxy: {
      '/api': {
        target: 'http://localhost:3000',
        changeOrigin: true,
        pathRewrite: {
          '^/api': ''
        },
        onProxyReq: function (proxyReq, req, res) {
          proxyReq.setHeader('accuracy', 100)
        }
      }
    }
  }
}

以上代码中，将accuracy设置为100，表示定位精度为100米。

3.4 使用第三方地图SDK

如果以上方法都无法解决定位问题，可以考虑使用第三方地图SDK。

目前市面上比较常用的地图SDK有百度地图SDK、高德地图SDK等。

使用百度地图SDK进行定位的代码实现如下：

// 引入百度地图SDK
import BMap from 'static/bmap.min';
// 获取当前位置
const BMapLocation = new BMap.Location();
BMapLocation.getCurrentPosition(function (r) {
  console.log(r);
});

以上代码中，首先引入百度地图SDK，然后使用BMap.Location()方法创建一个定位对象，再使用getCurrentPosition()方法获取当前位置。

4. 总结

定位不准是uniapp开发h5应用时常见的问题，可以通过检查定位权限、使用较准确的定位方式、调整定位精度、使用第三方地图SDK等方法解决。

开发者在使用uniapp进行h5应用开发时，应注意浏览器对定位API的支持情况，选择合适的定位方式进行开发。