关于web移动端定位

Posted 2020-08-13 时光城主

最近在做一个搜索附近3公里所有超市信息（已经录入数据库的超市信息）的功能。思路很简单只是获取用户当前地理位置（经纬度），通过sql语句筛选出3公里范围内的所有超市信息，然后传递到前台页面展示出来。但是我是第一次通过移动端web获取用户地理位置，遇到很多的问题，我觉得我有必要记录一下，一方面彰显自己的成就，一方面想把经验分享给大家。

移动web端获取用户地理位置很麻烦，因为涉及用户隐私，所以web获取用户地理位置的方式很少而且精确度很低。我刚知道要做定位的功能，第一时间去看了百度地图API，找到了web浏览器定位，说是浏览器定位其实也是通过用户IP定位，我很快就完成这个所谓的搜索功能，觉得这真是太简单了。但是事实并不是如此，我最开始测试的时候是用WiFi测试的，测试的结果发现精确度有点低，而且安卓端和ios端数据显示还不一样，根据我们的测试报告上说应该是ios更精准一些，这些还不算什么，因为我们只是搜索三公里范围内的数据有些误差也可以，但是一个致命的问题让我不得不放弃了百度地图。

这个致命问题就是，只要连接移动数据（不使用WiFi）全部都定位到合肥去了（测试使用的是安徽手机号），我百思不得其解，经过一番测试思考才明白所谓的ip定位是什么意思，也明白了所谓移动数据是什么？所谓的ip定位就是通过路由地址定位，移动网络就是一个大的WiFi网络环境，使用移动数据定位会定位到这个WiFi网络的路由所在地，也就是合肥。这一结果让我心凉，移动网络不能定位这让我们的需求也成了泡影，我不得不放弃已经完成的功能另外找寻找解决方案。

通过不停的搜索、寻找资料、询问前辈，我找到了第二种解决方案——html5定位，这个比之前调用百度地图的API简单多了，我很快又一次完成了这个功能。html5定位无论是连接WiFi还是移动网络都能定位到用户所在位置，但是同样也出现一个问题，使用WiFi比使用移动网络精准，但是这不影响我们的功能需求，算是符合我们的要求，但测试人员并不打算放过我，最新的测试报告上说IOS端会弹出这么一段话Origin does not have permission to use Geolocation service，翻译过来就是请求源没有权限使用地理定位服务，我一脸懵逼。找了很多资料才明白，苹果公司认为http请求都是不安全的所以拒绝为http请求提供地理定位服务，而我们公司使用的就是http请求。

我这时候有点绝望了，疯狂的找解决方案，最后还真让我找到了——腾讯地图。我一直觉得腾讯很坑爹，网页游戏都被人骂，但是这次不得不感谢它。腾讯地图也是使用html5定位技术但人家是https请求，所以腾讯抓住了这个机会，建立一个类似中转站的请求转发（我个人的理解）。我们的请求会到腾讯的中转站（https）然后在（https）返回给我们这样我们的请求就是https请求IOS用户端就会为我们的定位提供地理位置定位服务了，这次测试终于过了。

虽然过程很曲折但是结果还算不错，总算满足了定位的功能需求，也收获了很多东西。