js獲取內網ip地址，操作系統，瀏覽器版本等信息

這次呢，說一下使用js獲取用戶電腦的ip信息，剛開始只是想獲取用戶ip，後來就順帶着獲取了操作系統和瀏覽器信息。

　　先說下獲取用戶ip地址，包括像ipv4,ipv6,掩碼等內容，但是大部分都要根據瀏覽器的支持情況來決定，目前主流瀏覽器對於ipv4的支持是統一的。第一種：用於僅支持IE的且允許Activex運行，利用ActiveObject來獲取。這種的話可以選擇性使用。第二種：利用其它平臺的接口，在自己程序中使用如：新浪，太平洋等的接口，來給用戶返回ip地址，這種是不太安全的方式，萬一人家改變接口了呢？第三種（也是我採用的方式）：使用WebRTC(Web Real-Time Communications),他的定義是一項實時通訊技術，它允許網絡應用或者站點，在不借助中間媒介的情況下，建立瀏覽器之間點對點（Peer-to-Peer）的連接，實現視頻流和（或）音頻流或者其他任意數據的傳輸。當然這些信息和基本api在MDN上面是可以查看的。我們可以使用WebRTC獲取ip地址，經測試，在chrome，opera，firefox，safari均可正常獲取，對於IE和Edge，可以採用第一種方式進行兼容。下面是獲取代碼（我這裏沒有支持IE/Edge）：

function getBrowserInfo(){
    var agent = navigator.userAgent.toLowerCase() ;
    console.log(agent);
    var arr = [];
    var system = agent.split(' ')[1].split(' ')[0].split('(')[1];
    arr.push(system);
    var regStr_edge = /edge\/[\d.]+/gi;
    var regStr_ie = /trident\/[\d.]+/gi ;
    var regStr_ff = /firefox\/[\d.]+/gi;
    var regStr_chrome = /chrome\/[\d.]+/gi ;
    var regStr_saf = /safari\/[\d.]+/gi ;
    var regStr_opera = /opr\/[\d.]+/gi;
    //IE
    if(agent.indexOf("trident") > 0){
        arr.push(agent.match(regStr_ie)[0].split('/')[0]);
        arr.push(agent.match(regStr_ie)[0].split('/')[1]);
        return arr;
    }
    //Edge
    if(agent.indexOf('edge') > 0){
        arr.push(agent.match(regStr_edge)[0].split('/')[0]);
        arr.push(agent.match(regStr_edge)[0].split('/')[1]);
        return arr;
    }
    //firefox
    if(agent.indexOf("firefox") > 0){
        arr.push(agent.match(regStr_ff)[0].split('/')[0]);
        arr.push(agent.match(regStr_ff)[0].split('/')[1]);
        return arr;
    }
    //Opera
    if(agent.indexOf("opr")>0){
        arr.push(agent.match(regStr_opera)[0].split('/')[0]);
        arr.push(agent.match(regStr_opera)[0].split('/')[1]);
        return arr;
    }
    //Safari
    if(agent.indexOf("safari") > 0 && agent.indexOf("chrome") < 0){
        arr.push(agent.match(regStr_saf)[0].split('/')[0]);
        arr.push(agent.match(regStr_saf)[0].split('/')[1]);
        return arr;
    }
    //Chrome
    if(agent.indexOf("chrome") > 0){
        arr.push(agent.match(regStr_chrome)[0].split('/')[0]);
        arr.push(agent.match(regStr_chrome)[0].split('/')[1]);
        return arr;
    }else{
        arr.push('請更換主流瀏覽器，例如chrome,firefox,opera,safari,IE,Edge!')
        return arr;
    }
}

　　其次是獲取操作系統，瀏覽器信息：這裏到沒有那麼麻煩，我使用了包含瀏覽器信息的Navigator對象，這個對象雖然沒有公開標準，但是所有的瀏覽器都支持他，這就好辦了。我們主要用到的是useragent屬性，他包含了這些信息，我們要做的只是使用正則表達式分離和提取，針對不同的瀏覽器，兼容chrome,firefox,opera,ie,edge,safari等，對於其他瀏覽器，例如360極速等，會返回相應內核對應的瀏覽器名稱。也可以再進行其他判斷。下面是代碼：

function getYourIP(){
    var RTCPeerConnection = window.RTCPeerConnection || window.webkitRTCPeerConnection || window.mozRTCPeerConnection;
    if (RTCPeerConnection) (function () {
        var rtc = new RTCPeerConnection({iceServers:[]});
        if (1 || window.mozRTCPeerConnection) {     
            rtc.createDataChannel('', {reliable:false});
        };
        
        rtc.onicecandidate = function (evt) {
            if (evt.candidate) grepSDP("a="+evt.candidate.candidate);
        };
        rtc.createOffer(function (offerDesc) {
            grepSDP(offerDesc.sdp);
            rtc.setLocalDescription(offerDesc);
        }, function (e) { console.warn("offer failed", e); });
        
        
        var addrs = Object.create(null);
        addrs["0.0.0.0"] = false;
        function updateDisplay(newAddr) {
            if (newAddr in addrs) return;
            else addrs[newAddr] = true;
            var displayAddrs = Object.keys(addrs).filter(function (k) { return addrs[k]; });
            for(var i = 0; i < displayAddrs.length; i++){
                if(displayAddrs[i].length > 16){
                    displayAddrs.splice(i, 1);
                    i--;
                }
            }
            document.getElementById('list').textContent = displayAddrs[0];
        }
        
        function grepSDP(sdp) {
            var hosts = [];
            sdp.split('\r\n').forEach(function (line, index, arr) { 
               if (~line.indexOf("a=candidate")) {    
                    var parts = line.split(' '),       
                        addr = parts[4],
                        type = parts[7];
                    if (type === 'host') updateDisplay(addr);
                } else if (~line.indexOf("c=")) {       
                    var parts = line.split(' '),
                        addr = parts[2];
                    updateDisplay(addr);
                }
            });
        }
    })();
    else{
        document.getElementById('list').textContent = "請使用主流瀏覽器：chrome,firefox,opera,safari";
    }
}

用node內置系統模塊os同步獲取：

let getIP = function() {
  let interfaces = require("os").networkInterfaces();
  for (var devName in interfaces) {
    var iface = interfaces[devName];
    for (var i = 0; i < iface.length; i++) {
      let alias = iface[i];
      if (
        alias.family === "IPv4" &&
        alias.address !== "127.0.0.1" &&
        !alias.internal
      ) {
        if (alias.address) {
          return alias.address;
        }
      }
    }
  }
};