前端Js获取本网IP和外网IP方法总汇

我们应该知道一台电脑需要两个ip才可以上网，一个是本地的内网ip(本地ip)，另一个就是外网ip(公网ip)。值得说明的是：外网ip具有世界范围的唯一性，而内网ip只在局域网内部具有唯一性。并且一个局域网里所有电脑的内网IP是互不相同的,但共用一个外网IP。
下面我们通过js来分别获取当前电脑的内网ip和外网ip。

 

js获取内网ip 

方式一：新浪的IP地址查询接口

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

 

方式二：ipify接口,get请求获取

<script>
	function get(url,cb){
		var httpRequest = new XMLHttpRequest();
		httpRequest.open('GET', url, true);
		httpRequest.send();
		httpRequest.onreadystatechange = function () {
		    if (httpRequest.readyState == 4 && httpRequest.status == 200) {
		        var json = httpRequest.responseText;
				cb(json);
		    }
		};	
	}
	get("https://api.ipify.org/?format=json",function(data){
		data=JSON.parse(data);
		console.log(data.ip);
	});
</script>

 

方式三：其它可获取公网IP的网址

http://www.fly63.com/php/ipquery/(推荐，本站推出的工具，除了查询本机公网IP或本地IP外，还支持查询域名所在的服务器IP)
http://ip.360.cn/IPShare/info
http://myip.com.tw/
http://ip.xianhua.com.cn/
https://www.ip.cn/
https://www.123cha.com/ip/
https://ip38.com/
http://ip.chinaz.com
https://www.taobao.com/help/getip.php(推荐，天猫和淘宝都需要使用)

 

JS获取内网IP

<script type="text/JavaScript">
function getIP(callback) {
	let recode = {};
	let RTCPeerConnection = window.RTCPeerConnection || window.mozRTCPeerConnection || window.webkitRTCPeerConnection;
	// 如果不存在则使用一个iframe绕过
	if (!RTCPeerConnection) {
		// 因为这里用到了iframe，所以在调用这个方法的script上必须有一个iframe标签
		// <iframe id="iframe" sandbox="allow-same-origin" style="display:none;"></iframe>
		let win = iframe.contentWindow;
		RTCPeerConnection = win.RTCPeerConnection || win.mozRTCPeerConnection || win.webkitRTCPeerConnection;
	}
	//创建实例，生成连接
	let pc = new RTCPeerConnection();
	// 匹配字符串中符合ip地址的字段
	function handleCandidate(candidate) {
		let ip_regexp = /([0-9]{1,3}(\.[0-9]{1,3}){3}|([a-f0-9]{1,4}((:[a-f0-9]{1,4}){7}|:+[a-f0-9]{1,4}){6}))/;
		let ip_isMatch = candidate.match(ip_regexp)[1];
		if (!recode[ip_isMatch]) {
			callback(ip_isMatch);
			recode[ip_isMatch] = true;
		}
	}
	//监听icecandidate事件
	pc.onicecandidate = (ice) => {
		if (ice.candidate) {
			handleCandidate(ice.candidate.candidate);
		}
	};
	//建立一个伪数据的通道
	pc.createDataChannel('');
	pc.createOffer((res) => {
		pc.setLocalDescription(res);
	}, () => {});
	//延迟，让一切都能完成
	setTimeout(() => {
		let lines = pc.localDescription.sdp.split('\n');
		lines.forEach(item => {
			if (item.indexOf('a=candidate:') === 0) {
				handleCandidate(item);
			}
		})
	}, 1000);
}
//调用
getIP( function (ip) {
    console.log(ip);
})
</script>