前端如何获取用户经纬度问题(jquery获取用户经纬度问题)

最新推荐文章于 2024-05-12 01:15:00 发布

藏剑于袖

最新推荐文章于 2024-05-12 01:15:00 发布

阅读量917

点赞数

分类专栏：笔记文章标签：前端 jquery javascript

本文链接：https://blog.csdn.net/yangpengze/article/details/125174577

版权

笔记专栏收录该内容

47 篇文章 0 订阅

订阅专栏

近期领导突然来找我说一个以前的项目(jquery)需要在注册页面获取到用户的信息并且传递给后端
我大概搜索了一下

前端想要获取用户的经纬度没有直接的方法需要去地图上调用api需要下载插件，调api。当前⽐较流⾏的定位API有腾讯地图、百度地图、⾼德地图、搜狗地图等等，
在这⾥我使⽤的是腾讯地图定位API，根据⽤户IP获取⽤户当前位置，API返回结果详细到区⼀级，包涵经纬度。

我找了几个方法大家看一下，如果有错误请私聊我

腾讯地图极简的定位API——IP定位

IP定位的优缺点：
优点：极简，易懂。不需要⽤户地理位置授权，不需要引⽤插件，⼀个ajax完全搞定。
缺点：定位不准确，虽说可定位到区⼀级，但实际上⼀般只能定位到市⼀级，偶尔还只能定位到省⼀级，此时就要⽤到⼿动定位了。
1⽰例（此处的开发密钥是我已经在腾讯申请好了的，若要引⽤，烦请去腾讯申请，申请流程很简单。）
1.31 jquery实现IP定位

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>腾讯定位-jquery</title>
<meta content="width=device-width,height=device-height,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" name="viewport">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script><!-- 引⽤⾕歌jQuery -->
</head>
<body></body>
<script type="text/javascript">
    $.ajax({
        type: "get",//接⼝规定，只能⽤get
        async: true,//异步
        url: "https://apis.map.qq.com/ws/location/v1/ip",//接⼝地址
        data: {"key":"PTMBZ-GCQLW-SC2RG-R2FNI-HWPNQ-4PBQM","output":"jsonp"},//参数格式必须⽤到output传参为jsonp，否则会报跨域问题
        dataType: "jsonp",//跨域，必须⽤到jsonp
        success: function(result){
            console.log(JSON.stringify(result));
            document.write(JSON.stringify(result));
        },
        error: function (XMLHttpRequest,textStatus,errorThrown){
            console.log(JSON.stringify(XMLHttpRequest));
            document.write(JSON.stringify(XMLHttpRequest));
        }
    });
</script>
</html>

腾讯地图精准定位API——前端定位组件

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>腾讯定位-jquery</title>
<meta content="width=device-width,height=device-height,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" name="viewport">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script><!-- 引⽤⾕歌jQuery -->
<script src="https://3gimg.qq.com/lightmap/components/geolocation/geolocation.min.js"></script><!-- 引⽤腾讯前端定位插件，建议下载到本地 -->
</head>
<body></body>
<script type="text/javascript">
//实例化定位插件定位获取地理位置信息，本插件只有在服务器上才能运⾏，不像IP定位，⾮服务器也能运⾏
var geolocation = new qq.maps.Geolocation("PTMBZ-GCQLW-SC2RG-R2FNI-HWPNQ-4PBQM","meizi2");//参数为:开发秘钥、开发秘钥名称
    geolocation.getLocation(function(result){//定位成功
        console.log(result);
        document.write(JSON.stringify(result));
    },function(error){//定位失败
        console.log(error);
        document.write(JSON.stringify(error));
    });
</script>
</html>

从我的使⽤经验来看，腾讯地图的定位并不⾜够准确，只能定位到市⼀级，区⼀级经常获取不到。但是我的需求只要到市⼀级，所以也够
⽤了。

藏剑于袖

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
前端如何获取用户经纬度问题(jquery获取用户经纬度问题)

IP定位的优缺点：优点：极简，易懂。不需要⽤户地理位置授权，不需要引⽤插件，⼀个ajax完全搞定。缺点：定位不准确，虽说可定位到区⼀级，但实际上⼀般只能定位到市⼀级，偶尔还只能定位到省⼀级，此时就要⽤到⼿动定位了。1⽰例（此处的开发密钥是我已经在腾讯申请好了的，若要引⽤，烦请去腾讯申请，申请流程很简单。）1.31 jquery实现IP定位...
复制链接

扫一扫