浏览器端反爬虫特征收集之WebRtc本地IP收集

最新推荐文章于 2025-08-30 10:24:21 发布

原创最新推荐文章于 2025-08-30 10:24:21 发布 · 2.4k 阅读

6 ·

CC 4.0 BY-SA版权

爬虫与反爬虫同时被 2 个专栏收录

25 篇文章

订阅专栏

chrome

19 篇文章

订阅专栏

本文深入探讨WebRTC技术，介绍如何在Chrome浏览器中利用WebRTC获取本地IP地址，涉及ICE、STUN、TURN等协议及NAT穿越原理。通过示例代码展示获取本地SDP信息并解析出IP地址的过程。

1 基本概念

WebRTC（Web Real-Time Communication)网页实时通信，允许网络应用不借助中间媒介情况下建立P2P(Peer-to-Peer)连接，实现

视频流或其它任意数据传输[1]。因此需要使用NAT穿越技术。在WebRTC使用了ICE协议框架，里面提到了STUN和TURN两个协议，而

NAT穿越实现就是由这两个协议共同协调完成的。这里涉及了ICE、STUN、NAT、NAT、TURN、SDP等概念具体可以查看参考资料一。

它的工作流程可以简述为基于ICE协议框架(整合了STUN与TURN)，本地服务向stun服务器发送请求，stun服务器将本地服务器的ip端口

等信息填入candidate中，并回传本地服务，通过stun服务器来判断NAT的类型。从而决定后续是否需要使用turn服务器进行p2p通信。

2 chrome中通过WebRTC获取本地IP

下面的代码摘自参考8，本文测试如下代码使用的chrome版本为Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/73.0.3669.0 Safari/537.36。如果用到其它版本chrome浏览器获取ip失败可参照参考6的方法进行排查分析。其获取思路即获取本地SDP信息并从中摘取candidate部分拿到本地IP。

// ice配置信息，指定了stun server地址
   var servers = {
       iceServers: [{
           urls: "stun:stun.l.google.com:19302?transport=udp"
       }]
   };
    
// 构建 RTC connection对象，创建peer端
var pc = new RTCPeerConnection({servers}); 


//创建一个数据传输通道
pc.createDataChannel("");

// 生成本地SDP
pc.createOffer(function(result) {
    pc.setLocalDescription(result, function() {           console.log("success");
    }, function(e) {
        console.log(e);
    });
}, function() {});

//listen for candidate events
pc.onicecandidate = function(ice) {
    //skip non-candidate events
    if (ice.candidate) {
        handleCandidate(ice.candidate.candidate);
    }
};
    
//等待一段时间后读取本地sdp
 setTimeout(function() {
     try {

         var lines = pc.localDescription.sdp.split('\n');
         console.log(pc.localDescription.sdp);
         lines.forEach(function(line) {
             if (line.indexOf('a=candidate:') === 0)
                 handleCandidate(line);
         });
     } catch (err) {
         console.log(err);
     }
 }, 100);
 
// 解析ip
function handleCandidate(candidate) {
        //match just the IP address
        var ip_regex = /([0-9]{1,3}(\.[0-9]{1,3}){3}|[a-f0-9]{1,4}(:[a-f0-9]{1,4}){7})/
        var ip_addr = ip_regex.exec(candidate)[1];

        //remove duplicates
        if (ip_dups[ip_addr] === undefined)
            callback(ip_addr);

        ip_dups[ip_addr] = true;
    }

IP通过candidate获取，样例如下。解析代码解析candidate所在行，实现获取IP。

a=candidate:735671172 1 udp 2113937151 172.30.23.16 60444 typ host generation 0 network-cost 999

v=0
o=- 4472746833261312439 2 IN IP4 127.0.0.1
s=-
t=0 0
a=group:BUNDLE data
a=msid-semantic: WMS
m=application 60444 DTLS/SCTP 5000
c=IN IP4 192.168.199.106
a=candidate:735671172 1 udp 2113937151 192.168.199.106 60444 typ host generation 0 network-cost 999
a=ice-ufrag:24I4
a=ice-pwd:PDshREZzi1C39qwm9Q17XeUx
a=ice-options:trickle
a=fingerprint:sha-256 3E:F0:EF:B2:9E:93:02:80:DE:FA:3F:E8:EF:29:7D:D6:CF:11:5D:90:8E:DB:FC:7F:91:BA:52:DC:41:AB:6C:B5
a=setup:actpass
a=mid:data
a=sctpmap:5000 webrtc-datachannel 1024

获取IP的两个点分别在onicecandidate事件处理与读取本地sdp信息两个位置。这两个信息分别属于RTCPeerConnection对象的localDescription.sdp属性，RTCIceCandidate对象的属性candidate(onicecandidate回调函数中接收的参数类型是RTCIceCandidate)。

因此若要改变那么调整这两个对象对应的属性即可。

RTCIceCandidate.prototype,"candidate"
RTCPeerConnection.prototype, "localDescription"

candidate即前文中的单行数据

a=candidate:735671172 1 udp 2113937151 172.30.23.16 60444 typ host generation 0 network-cost 999

localDescription的格式如下

{
    type: "offer",
    sdp: `v=0 
                      o=- 6840727536538077826 2 IN IP4 127.0.0.1
                      s=- 
                      t=0 0 
                      a=group:BUNDLE data 
                      a=msid-semantic: WMS 
                      m=application 49212 DTLS/SCTP 5000
                      c=IN IP4 192.168.3.16
                      a=candidate:735671172 1 udp 2113937151 172.30.23.16 49212 typ host generation 0 network-cost 999
                      a=ice-ufrag:O7iV 
                      a=ice-pwd:XtQuXGYaS+fudhdv3NBbIRiu 
                      a=ice-options:trickle
                      a=fingerprint:sha-256 AC:03:C1:45:9E:A5:23:8D:FB:C6:63:38:C2:69:B5:65:C9:7B:64:B3:68:FF:A3:4E:42:50:CC:AD:0F:FC:DD:3C
                      a=setup:actpass
                      a=mid:data
                      a=sctpmap:5000 webrtc-datachannel 1024`
}

3 总结

反爬中利用WebRtc收集本地IP并作为指纹的一个计算维度可提高识别率。但某些浏览器下会出现无法获取的情况。此外收集IP属于泄漏用户信息，不少大厂网站现在都在收集，所以使用chrome或ff一定要屏蔽相关功能防止隐私泄漏。

4 参考

[1].WebRTC基本概念,https://developer.mozilla.org/zh-CN/docs/Web/API/WebRTC_API
[2]RTCSessionDescription,https://developer.mozilla.org/en-US/docs/Web/API/RTCSessionDescription
[3]RTCPeerConnection,https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection
[4]sdp,https://developer.mozilla.org/en-US/docs/Web/API/RTCSessionDescription/sdp
[5]setLocalDescription,https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection/setLocalDescription
[6]连接错误的处理方式,https://blog.youkuaiyun.com/qq_40033374/article/details/87868275
[7]NAT穿越原理,https://www.jianshu.com/p/84e8c78ca61d
[8]WebRtc获取本地IP,https://github.com/diafygi/webrtc-ips