1. 程式人生 > 其它 >js獲取本地ip地址和外網IP地址

js獲取本地ip地址和外網IP地址

1,獲取內網ip

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"></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);
})

// 192.168.1.191
// 2001::2841:aa90:2843:1983:e4d1:a9b8

上面的是ipv4的,下面的是ipv6.

http://www.bijianshuo.com 軟文發稿平臺

1,獲取外網ip

發現比較全而好的前端獲取客戶端IP的方法基本都是通過三方介面。也就是呼叫別人寫好的介面。用瀏覽器已有的控制元件ActiveXObject的控制元件方式,有一定的相容性問題。

方法一:(所有的平臺及瀏覽器)

使用搜狐介面:

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

方法二:(所有的平臺及瀏覽器)

使用新浪介面:(我測試過,此方法好像不行。訪問網站也不能訪問了。)

<script type="text/JavaScript" src="http://counter.sina.com.cn/ip/" charset="gb2312"></script>       <!--獲取介面資料,注意charset -->
<script type="text/javascript">
document.writeln("IP地址:"+ILData[0]+"<br />");             //輸出介面資料中的IP地址
document.writeln("地址型別:"+ILData[1]+"<br />");         //輸出介面資料中的IP地址的型別
document.writeln("地址型別:"+ILData[2]+"<br />");         //輸出介面資料中的IP地址的省市
document.writeln("地址型別:"+ILData[3]+"<br />");         //輸出介面資料中的IP地址的
document.writeln("地址型別:"+ILData[4]+"<br />");         //輸出介面資料中的IP地址的運營商
</script>

方法三:

個人Robert Hashemian寫的:

<script language="JavaScript" src="http://www.hashemian.com/js/visitorIP.js.php"></script>
<script language="JavaScript">
    VIH_BackColor = "palegreen";
    VIH_ForeColor = "navy";
    VIH_FontPix = "16";
    VIH_DisplayFormat = "You are visiting from:<br>IP Address: %%IP%%<br>Host: %%HOST%%";
    VIH_DisplayOnPage = "yes";
</script>

方法四:(只針對IE且客戶端的IE允許AcitiveX執行,通過平臺:XP,SERVER03,2000)。

利用ActiveXObject控制元件,ie瀏覽器裡要開啟此控制元件:

<script language="JavaScript">
function GetLocalIPAddr(){ var oSetting = null; var ip = null; try{ oSetting = new ActiveXObject("rcbdyctl.Setting"); ip = oSetting.GetIPAddress; if (ip.length == 0){ return "沒有連線到Internet"; } oSetting = null; }catch(e){ return ip; } return ip; } document.write(GetLocalIPAddr()+"<br/>")
</script>