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("失败了");
}
})
},
希望对你有帮助,谢谢!
JavaScript和微信小程序获取IP地址的方法的更多相关文章
- 微信小程序开发-IP地址查询-例子
微信小程序开发 小程序搜索框 IP地址查询 搜索查询 样例 微信小程序 开发 参考 https://mp.weixin.qq.com/debug/wxadoc/dev/component/ ...
- 微信小程序获取当前地址以及选择地址详解 地点标记
首先定义事件: bindtap='getLocation' <view class='store-bot' bindtap='getLocation'> <view class='c ...
- 微信小程序-获取经纬度
微信小程序-获取经纬度 最近公司新功能 要求在外的市场人员 发送位置信息回来. 用的还是微信小程序开发.... 微信小程序 提供一个接口 getLocation 这个接口反回来的位置 相对实际位置 相 ...
- [微信小程序] 微信小程序获取用户定位信息并加载对应城市信息,wx.getLocation,腾讯地图小程序api,微信小程序经纬度逆解析地理信息
因为需要在小程序加个定位并加载对应城市信息 然而小程序自带api目前只能获取经纬度不能逆解析,虽然自己解析方式,但是同时也要调用地图,难道用户每次进小程序还要强行打开地图选择地址才定位吗?多麻烦也不利 ...
- C# 微信小程序获取openid sessionkey
项目介绍 1.微信小程序获取openid和session_key 2.后台使用C#开发 项目流程 准备工作 1 获取appid 1.1 下载微信web开发工具 https://developers.w ...
- 微信小程序获取地理位置
小程序只支持获取当前位置的经纬度,并不能直接获取到地理名称,需要通过第三方来逆地址解析,这里我选择的是腾讯位置服务 在使用前需要去申请key,这里是地址:https://lbs.qq.com/cons ...
- .Net之微信小程序获取用户UnionID
前言: 在实际项目开发中我们经常会遇到账号统一的问题,如何在不同端或者是不同的登录方式下保证同一个会员或者用户账号唯一(便于用户信息的管理).这段时间就有一个这样的需求,之前有个客户做了一个微信小程序 ...
- 微信小程序-获取当前位置和城市名
微信小程序-获取当前城市位置 1, 获取当前地理位置,首先要拿到用户的授权wx.openSetting: 2,微信的getLocation接口,获取当前用户的地理位置(微信返回的是经纬度,速度等参数) ...
- 微信小程序-获取当前城市位置及再次授权地理位置
微信小程序-获取当前城市位置 1. 获取当前地理位置,可通过wx.getLocation接口,返回经纬度.速度等信息; 注意---它的默认工作机制: 首次进入页面,调用该api,返回用户授权结果,并保 ...
随机推荐
- 用pillow和 opencv做透明通道的两图混全(blend)
from PIL import Image as image foreground = image.open("donkey.png") background = image.op ...
- ANE-如何加入ane,调试时又不报错
有时候我们加入ane,即使没有调用ane的功能,debug的时候也会报错无法调试,这是为什么呢?因为我们的ane没有把default包含进去. 首先我们的extension.xml要把default节 ...
- ceph pg_num 数值计算
通常在创建pool之前,需要覆盖默认的pg_num,官方推荐: 若少于5个OSD, 设置pg_num为128. 5~10个OSD,设置pg_num为512. 10~50个OSD,设置pg_num为40 ...
- mysql--对行(表中数据)的增删改查
一.插入数据(增加)insert 1.插入数据(顺序插入) 语法一: INSERT INTO 表名(字段1,字段2,字段3…字段n) VALUES(值1,值2,值3…值n); #指定字段来插入数据,插 ...
- WPF 内部Template 动画板 无法冻结此 Storyboard 时间线树供跨线程使用
解决此问题,需要一定的想象力. 换个思路即可 大体是 使用Tag或者别无用的可以输入数值的属性,或者附加属性也可以的.来绑定到你要动画的属性 当然这个过程中要使用转换器了 我给出一个关于Button ...
- Stacking方法详解
集成学习方法主要分成三种:bagging,boosting 和 Stacking.这里主要介绍Stacking. stacking严格来说并不是一种算法,而是精美而又复杂的,对模型集成的一种策略. 首 ...
- “全栈2019”22篇Java异常学习资料及总结
难度 初级 学习时间 10分钟 适合人群 零基础 开发语言 Java 开发环境 JDK v11 IntelliJ IDEA v2018.3 文章原文链接 "全栈2019"22篇Ja ...
- java -io字符流FileWrite操作演示
FileWriter字符输出流演示: /* * FiileWriter 字符流的操作 * FileWriter 的构造方法 可传递 File类型 还可以传递String类型 * * 方法 : * wr ...
- [JS] jq绑定事件的参数传递
$(function(){ var obj = {name:"select",param:"2"}; $("#select").click( ...
- 解决无法运行Terminator出现以下问题: File "/usr/bin/terminator"...SyntaxError: invalid syntax
在安装或者启动Terminator时可能出现这个问题: lin@Dev:~$ terminator File "/usr/bin/terminator", line 123 exc ...