jeecg vue 获取当前登录IP和地址

原创已于 2022-02-18 11:38:12 修改 · 2.4k 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js #tcp/ip #前端

于 2022-02-18 11:35:29 首次发布

jeecg 专栏收录该内容

3 篇文章

订阅专栏

这篇博客介绍了如何在Vue应用中利用百度API获取并显示用户的当前地理位置信息。通过引入百度地图的JavaScript库，并创建Geolocation对象，可以调用getCurrentPosition方法来获取详细的地址信息，包括城市和省份。如果定位失败，则显示默认提示。这个过程涉及到前端开发中的地理定位技术以及API整合。

调用百度api获取当前登录信息
在index.html引入

<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=“此处是百度ak密钥"></script>

Bmap依赖请引入 yarn add bmap

在自己想要得到信息的vue中
定义渲染属性

	LocationProvince:"正在定位所在省",    //给渲染层定义一个初始值
    LocationCity:"正在定位所在市" ,    //给渲染层定义一个初始值

方法

//获取当前登录地点
      getAddressIp(){

        const geolocation = new BMap.Geolocation();

        let _this = this
        geolocation.getCurrentPosition(function getinfo(position){
          let city = position.address.city;             //获取城市信息
          let province = position.address.province;     //获取省份信息
          _this.LocationProvince = province
          _this.LocationCity = city
        }, function(e) {
          _this.LocationCity = "定位失败"
        }, {provider: 'baidu'});
      },