JavaScript和微信小程序獲取IP地址的方法

最近公司新加了一個需求，根據用戶登錄的IP地址判斷是否重復登錄，重復登錄就進行逼退，那么怎么獲取到瀏覽器的IP地址呢？最后發現搜狐提供了一個JS接口，可以通過它獲取到客戶端的IP。

 

接口地址如下:

http://pv.sohu.com/cityjson?ie=utf-8

 

在瀏覽器輸入，返回了這些信息：

 

返回了一個returnCitySN變量，這是一個json對象。里面保存了ip，id和城市名字。

 

查詢代碼如下：

<script src="http://pv.sohu.com/cityjson?ie=utf-8"></script>  
<script type="text/javascript">  
document.write(returnCitySN["cip"]+','+returnCitySN["cname"])  
</script>

 

這樣我們寫出IP地址和城市名稱，我們判斷是否重復登錄就只需判斷IP地址是否相同。

 

接口代碼如下：

$(function() {

    //IP地址異地判斷

    var UserPhoneNum = getCookie("UserPhoneNum");
    var ipinfo = {
        "UserPhoneNum": '86//' + UserPhoneNum,
        "IP": returnCitySN["cip"]
    }

    $.ajax({
        url: "https://www.xxxxxxxxx.cn/xxxxxx/checklogin/",
        data: ipinfo,
        type: "get",
        success: function(data) {
            if(JSON.parse(data).state === 200) {

            } else {
                window.location.href = 'login.html';
                alert("您的賬號已在別處登錄，請退出再進行登錄！")
            }
        },
        error: function() {
            alert("登錄失效");
        }
    });

})

 

我們把IP地址取到，在登錄的時候我們通過接口參數上傳給后台進行儲存，然后通過上面這個接口判斷瀏覽器IP是否和登錄時IP一致，不一致就彈框提示並返回登錄界面；

 

微信小程序獲取IP:

地址如下：

 

https://fangyuanxiaozhan.com/get_ip

 

我們會得到如圖：

 

注意：上次有朋友提到上面這個地址證書失效了，那么我們就用上面那個接口

 

https://pv.sohu.com/cityjson?ie=utf-8

 

然后，我們可以得到數據

var returnCitySN = {"cip": "183.15.18.58", "cid": "440300", "cname": "廣東省深圳市"};

接下來就是重點了，怎么取到ip地址呢？

小程序我們data就是這個數據，我們取的話肯定不能returnCitySN[cip]，所以我們需要先轉換為數組然后去除某些符號（不懂的，請去看博主的另一篇博客https://www.cnblogs.com/hejun26/p/10406740.html）

wx.request({
      url: 'https://pv.sohu.com/cityjson?ie=utf-8',
      success: function (e) {
        console.log(e.data);
        var aaa = e.data.split(' ');
        console.log(aaa)
        var bbb=aaa[4]
        console.log(bbb)
        var ccc = bbb.replace('"','')
        console.log(ccc)
        var ddd = ccc.replace('"', '')
        console.log(ddd)
        var eee = ddd.replace(',', '')
        console.log(eee)
        that.setData({
          IP: eee
        })
      },
      fail:function(){
        console.log("失敗了");
      }
    })

打印出來就是：

 

好，大功完成！

 

 

然后js代碼如下：（此處為失效地址的寫法，如果知道該怎么寫，請忽視這里）

//獲取用戶IP地址
  data:{
     IP:""
  }
  onshow:function(){
    console.log("進來獲取ip地址");
    var that = this;
    wx.request({
      url: 'https://fangyuanxiaozhan.com/get_ip',
      success: function (e) {
        console.log(e.data);
        that.setData({
          IP: e.data.ip
        })
      },
      fail:function(){
        console.log("失敗了");
      }
    })
  },

 

希望對你有幫助，謝謝！