JS大法 - 纯JS 获取客户端IP地址

背景

项目中的sass 系统有多种用户权限，且同一个账号能够多我的同时登陆，致使有些操做没法直接追溯到对应的责任人，所以须要获取到当前登陆用户的IP地址（员工内部人员的内网地址）并收集上报。

如何收集

1. 公网IP

对于收集公网IP， 目前通用的是利用 新浪 和 搜狐 的接口，可兼容多种浏览器。对于一些使用如 ActiveX 等IE特有的API不作介绍，要想了解请转：www.cnblogs.com/zhangycun/p…

• 搜狐接口：

1<script src="http://pv.sohu.com/cityjson?ie=utf-8"></script>  
2<script type="text/javascript">  
3        document.write(returnCitySN["cip"]+','+returnCitySN["cname"])  // 110.87.118.246,福建省厦门市
4</script>复制代码

• 新浪接口：

1<script type="text/javascript" src="http://counter.sina.com.cn/ip/" charset="gb2312"></script>       <!--获取接口数据，注意charset -->
2<script type="text/javascript"> 
3    document.writeln("IP地址："+ILData[0]+"<br />");             //输出接口数据中的IP地址 
4    document.writeln("地址类型："+ILData[1]+"<br />");         //输出接口数据中的IP地址的类型 
5    document.writeln("地址类型："+ILData[2]+"<br />");         //输出接口数据中的IP地址的省市
6    document.writeln("地址类型："+ILData[3]+"<br />");         //输出接口数据中的IP地址的
7    document.writeln("地址类型："+ILData[4]+"<br />");         //输出接口数据中的IP地址的运营商
8</script>复制代码

缺点：依赖与搜狐和新浪的服务器稳定性，若是资源所在的服务器挂了，就没法获取到对应的IP

2. 内网IP

内网IP的获取相对比较复杂，主要是须要依赖 webRTC 这么一个很是用的API

WebRTC，名称源自网页即时通讯（英语：Web Real-Time Communication）的缩写，是一个支持网页浏览器进行实时语音对话或视频对话的API。它于2011年6月1日开源并在Google、Mozilla、Opera支持下被归入万维网联盟的W3C推荐标准。

webRTC 是HTML 5 的一个扩展，容许去获取当前客户端的IP地址，能够查看当前网址：net.ipcalf.com/

若是使用 chrome 浏览器打开，此时可能会看到一串相似于： 

e87e041d-15e1-4662-adad-7a6601fca9fb.local复制代码

的机器码，这是由于chrome 默认是隐藏掉 内网IP地址的，能够经过修改 chrome 浏览器的配置更改此行为：

1. 在chrome 浏览器地址栏中输入：chrome://flags/
2. 搜索 #enable-webrtc-hide-local-ips-with-mdns 该配置 并将属性改成 disabled
3. relaunch 浏览器便可查看到本机的内网IP地址

附上利用 webRTC 获取内网的精简版js 代码(若是是chrome 浏览器，务必先修改浏览器 plugin 配置，修改方法往上瞅)

github 源码：webrtc-ips

1 window.RTCPeerConnection = window.RTCPeerConnection || window.mozRTCPeerConnection || window.webkitRTCPeerConnection; //compatibility for Firefox and chrome
 2 var pc = new RTCPeerConnection({iceServers:[]}), noop = function(){};      
 3 pc.createDataChannel(''); //create a bogus data channel
 4 pc.createOffer(pc.setLocalDescription.bind(pc), noop); // create offer and set local description
 5 pc.onicecandidate = function(ice){
 6     if (ice && ice.candidate && ice.candidate.candidate){
 7        var myIP = /([0-9]{1,3}(\.[0-9]{1,3}){3}|[a-f0-9]{1,4}(:[a-f0-9]{1,4}){7})/.exec(ice.candidate.candidate)[1];
 8        console.log('my IP: ', myIP);   
 9        pc.onicecandidate = noop;
10     }
11};复制代码