WebRTC获取IP地址问题,Uncaught TypeError: Cannot read property '1' of null

临时接了个任务,客户要求某个账号只能在某个ip或者mac上登录,其余的情况的登录都要报错,首先就要解决看看怎么获取ip

使用的获取IP的语句如下,类似的在网上很多,主要的获取的逻辑都是一样的

    <script>
// 创建 RTCPeerConnection 对象
const peerConnection = new RTCPeerConnection();
// 添加一个空的数据通道
peerConnection.createDataChannel('dummy');
// 创建一个 ICE 候选对象
peerConnection.onicecandidate = (event) => {
if (event.candidate) {
// 提取 IP 地址信息
//const ipRegex = /([0-9]{1,3}(\.[0-9]{1,3}){3})/;
const ipRegex = /([0-9]{1,3}(\.[0-9]{1,3}){3}|[a-f0-9]{1,4}(:[a-f0-9]{1,4}){7})/;
console.log("event.candidate.candidate :" + event.candidate.candidate);
//candidate:3088297775 1 udp 2113937151 4b52bd75-3d6f-4c7b-8bea-394c6d2a14d3.local 60294 typ host generation 0 ufrag mKXg network-cost 999
const ipAddress = ipRegex.exec(event.candidate.candidate)[1];
// 输出 IP 地址
console.log('IP 地址:', ipAddress);
// 关闭连接
peerConnection.close();
}
};
// 创建一个 SDP(Session Description Protocol)提议
peerConnection.createOffer().then((offer) => {
// 设置本地描述
return peerConnection.setLocalDescription(offer);
}).catch((error) => {
console.error('创建 Offer 失败:', error);
});
</script>

但是在edge和Chrome上执行的时候会报错,提示

Uncaught TypeError: Cannot read property '1' of null

因为说实话不是很熟悉前端,但是大概能猜到是null导致的

那么就去找是哪里null了

很快就发现,貌似那个正则并没有匹配到数据,所以要不是匹配的规则有问题,要不就是要匹配的内容有问题

很快发现,candidate的内容中并没有ip类型的数据,反而有一个.local

在网上查了一下,发现就是这部分的问题,原因是浏览器做了相应的设置,但是很难受,因为这种操作不适用我这种系统要给客户使用的情况,总不能每个人都要改设置才可以

只能另寻他路

PS:

可以使用这个网址进行查询

https://whois.pconline.com.cn/ipJson.jsp?callback=ipJson



https://api.ipify.org?format=jsonp&callback=getIP

但是我试了下,查出来的地址是准的,但是实际的ip有出入,建议自己多试试


参考:

https://blog.csdn.net/weixin_43915401/article/details/111830699

WebRTC获取IP地址问题,Uncaught TypeError: Cannot read property '1' of null的更多相关文章

  1. Uncaught TypeError: Cannot set property 'onclick' of null解决办法

    如果把js内容直接放在这个head标签以内,button按钮不能正常点击更换body的背景颜色,报错提示:demo6.html:16 Uncaught TypeError: Cannot set pr ...

  2. Uncaught TypeError: Cannot read property 'insertAdjacentHTML' of null

    在开发Ext 项目中如果遇到 Uncaught TypeError: Cannot read property 'insertAdjacentHTML' of null 这个错误,检查下renderT ...

  3. Uncaught TypeError: Cannot set property 'innerHTML' of null

    学习Chrome插件时,要在弹出页面中显示当前时间,结果怎样也显示不出来 看了 http://www.cnblogs.com/mfryf/p/3701801.html 这篇文章后感悟颇深 通过调试发现 ...

  4. Three.js three.js Uncaught TypeError: Cannot read property 'getExtension' of null

    在调试Three.js执行加载幕布的时候,突然爆出这个错误three.js Uncaught TypeError: Cannot read property 'getExtension' of nul ...

  5. JavaScript Uncaught TypeError: Cannot read property 'value' of null

    用 JavaScript 操作 DOM 时出现如下错误: Uncaught TypeError: Cannot set property 'value' of null Uncaught TypeEr ...

  6. 前台报错:Uncaught TypeError: Cannot read property '0' of null

    错误现象: var div1=mycss[0].style.backgroundColor;  //这一行提示360和chrome提示:Uncaught TypeError: Cannot read  ...

  7. 解决sweetalert 无故报错 elem.className.replace Uncaught TypeError: Cannot read property 'className' of null

    今天碰到这么一个问题,在使用sweetalert的时候时有时无会报错 elem.className.replace Uncaught TypeError: Cannot read property ' ...

  8. vue报错 Uncaught TypeError: Cannot read property ‘children ’ of null

    Uncaught TypeError: Cannot read property ‘children ’ of null ratings未渲染完毕,就跳走goods了,取消默认跳转,即可

  9. Uncaught TypeError: Cannot read property 'ownerDocument' of null

    /********************************************************************* * Uncaught TypeError: Cannot ...

  10. JavaScript中"Uncaught TypeError: Cannot set property 'innerHTML' of null"错误

    写了一个函数,在调用时出错:"Uncaught TypeError: Cannot set property 'innerHTML' of null" 代码如下: <!DOC ...

随机推荐

  1. python处理txt文件常用方法总结

    一 打开txt的正确方式 一般人会用到怎么快速打开txt,下面分享两种方式: f = open("data.txt","r") #设置文件对象 f.close( ...

  2. Java诊断工具Arthas:开篇之watch实战

    Arthas是阿里开源的线上监控诊断产品,用于问题的排查和诊断. 它的出现大大提高线上排查问题的效率,这篇只讲它一个非常牛逼的功能,其它功能往后篇章会在展开详细说. 一.Arthas能为你做什么? 1 ...

  3. 译:使用现代的 Node.js 构建简单的CLI工具

    原文地址: https://evertpot.com/node-changelog-cli-tool/ 作者: Evert Pot 发布时间:2023-02-13 只使用 Node.js 的标准库,不 ...

  4. 全国标杆!3DCAT实时云渲染助力深圳移动5G+智慧校园建设

    2023年2月27日,中国移动在陕西西安召开全国教育行业全年工作部署暨电子学生证专项调度会,来自全国各地的移动分公司.专家.合作伙伴等参加了会议.瑞云科技旗下3DCAT实时渲染云作为中国移动的重要合作 ...

  5. 基于QGIS生产建筑物高度与遥感影像数据集

    1. 概述 利用遥感影像推知建筑物高度是一经典研究,现有很多学者利用机器学习的方式,利用现有数据进行训练从而构建模型 本文旨在记述使用QGIS进行建筑物高度与遥感影像数据集的获取与制作 如果不想自己动 ...

  6. 主nginx和子nginx-------域名-端口-解答

    主nginx和子nginx-------域名-端口-解答 想象一下Nginx是一个接待员,每个端口就像接待员的一个电话线,而server_name就像是客户拨打的不同号码. 当你在Nginx配置文件里 ...

  7. Redis源码学习(1)──字符串

    redis 版本:5.0 本文代码在Redis源码中的位置:redis/src/sds.c.redis/src/sds.h 源码整体结构 src:核心实现代码,用 C 语言编写 tests:单元测试代 ...

  8. 浅谈ET框架--ECS设计核心(一)

    ET框架的ECS设计核心可以总结为一句话,那就是: 继承转组件,多态转分发 OOP设计里的继承更换为组件Component模式,多态转成分发模式. 框架代码里头的案例: 数值组件挂载Entity上. ...

  9. Promise + Async&Await + Array.reduce + 函数递归 解决网络/接口请求的依次/排队不间断间隔访问

    背景 试想在一个需要频繁更新数据的场景(例如:监控.图表类),常规方法是设置一个间隔 N 秒的定时器 setInterval:但是这种方式存在一个问题,当前一个请求时间过长时(超过了间隔时间),后一个 ...

  10. 两个专栏帮你搞定【图像拼接(image stitching)】

    [图像拼接论文精读]专栏:图像拼接论文精读 [图像拼接源码精读]专栏:图像拼接论文源码精读 前言 图像拼接(image stitching)是计算机视觉中的高级图像处理手段,是一个小众方向,研究的人很 ...