vue项目前端获取本机IP

这篇具有很好参考价值的文章主要介绍了vue项目前端获取本机IP。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

首先要解除浏览器获取本机IP的安全限制

火狐(FireFox) 删除隐藏IP

浏览器输入 about:config

搜索配置 media.peerconnection.enabled 改为false ( 刷新程序,IP正常显示 )

谷歌(Chrome) 删除隐藏IP

浏览器输入:chrome://flags/#enable-webrtc-hide-local-ips-with-mdns

把 Anonymize local IPs exposed by WebRTC 设置为 disabled ( 刷新程序,IP正常显示 )

edge浏览器删除隐藏ip

浏览器输入: edge://flags/#enable-webrtc-hide-local-ips-with-mdns

把 Anonymize local IPs exposed by WebRTC 设置为 disabled ( 刷新程序,IP正常显示 )

备注

1.设置完成后要重启浏览器
2.若没有查到相对应的设置,请检查浏览器版本更新文章来源地址https://www.toymoban.com/news/detail-479252.html

methods方法

// 获取ip地址
    getUserIP(onNewIP) { 
      console.log('获取ip')
      let MyPeerConnection = window.RTCPeerConnection || window.mozRTCPeerConnection || window.webkitRTCPeerConnection
      let pc = new MyPeerConnection({iceServers: []})
      let noop = function () {}
      let localIPs = {}
      let ipRegex = /([0-9]{1,3}(\.[0-9]{1,3}){3}|[a-f0-9]{1,4}(:[a-f0-9]{1,4}){7})/g
      function iterateIP (ip) {
          if (!localIPs[ip]) onNewIP(ip)
          localIPs[ip] = true
      }
      pc.createDataChannel('')
      pc.createOffer().then(function (sdp) {
        sdp.sdp.split('\n').forEach(function (line) {
          if (line.indexOf('candidate') < 0) return
          line.match(ipRegex).forEach(iterateIP)
        })
        pc.setLocalDescription(sdp, noop, noop)
      }).catch(function (reason) {
      // An error occurred, so handle the failure to connect
      })
      // seen for candidate events
      pc.onicecandidate = function (ice) {
        if (!ice || !ice.candidate || !ice.candidate.candidate || !ice.candidate.candidate.match(ipRegex)) return
        ice.candidate.candidate.match(ipRegex).forEach(iterateIP)
      }
    },

在created中调用获取IP的方法

	var _that = this
    this.getUserIP(function(ip){
      console.log("得到的本地IP :" + ip)  // 得到的本地IP :192.168.21.23
      console.log(_that.loginForm) 
      _that.loginForm.userIP = ip  //这里不能用this 因为this指向的是这个回调函数的this
    })

到了这里,关于vue项目前端获取本机IP的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 悄悄告诉你:前端如何获取本机IP,轻松一步开启网络探秘之旅

    🐔 前期回顾 Vite+Vue3+Ts 实战本地运行GPT_彩色之外的博客-CSDN博客 本地运行 使用GPT https://blog.csdn.net/m0_57904695/article/details/131851601?spm=1001.2014.3001.5501 目录  🛹 第一种:上白度  🤖 第二种:JS获取  😷  谢谢观看 几行代码,轻松获取本机 IP 地址,究竟是怎样实现的?  控制台

    2024年02月05日
    浏览(43)
  • Gin:获取本机IP,获取访问IP

     获取本机IP  获取访问IP 参考来源: go+gin获取本机ip和获取访问ip - 简书

    2024年01月21日
    浏览(37)
  • python获取本机的IP

    方法一: 通常使用socket.gethostbyname()方法即可获取本机IP地址,但有时候获取不到(比如没有正确设置主机名称),示例代码如下: 方法二: 这个方法获取本机服务器的IP。没有任何的依赖。 而是利用 UDP 协议来实现的,生成一个UDP包,把自己的 IP 放入到 UDP 协议头中,然后从

    2024年02月06日
    浏览(38)
  • (vue)前端获取ip方法

    解决参考:https://www.fke6.com/html/78898.html

    2024年02月12日
    浏览(34)
  • Shell脚本中获取本机ip地址,Linux获取本地ip地址

    在 Shell 脚本中获取本机 IP 地址可以通过多种方式实现,这里介绍三种常用的方法: 1. 使用 ifconfig 命令获取本机 IP 地址 ifconfig 命令可以获取本机网卡的配置信息,包括 IP 地址。可以通过 grep 命令过滤出 IP 地址信息,再使用 awk 命令提取出具体的 IP 地址。示例代码如下:

    2024年02月11日
    浏览(54)
  • 获取本机外网 IP 的方法

    在 Python 中,可以使用多种方法获取本机的外网 IP 地址。下面我将介绍两种常用的方法:使用第三方 API 和解析网页内容。 方法一:使用第三方 API 有一些提供免费的外部接口(API),可以方便地获取本机的外网 IP 地址。其中一个常用的 API 为 http://ipinfo.io/json。我们可以使用

    2024年02月03日
    浏览(41)
  • JavaScript 如何获取本机IP地址

    获取本机IP地址是前端工程师经常需要处理的问题。JavaScript 有几种方法可以获取客户端的IP地址。下面是三种获取本机IP的方法。 方法1:使用第三方 API 一种获取客户端IP地址的最简单方法是使用第三方API。可以使用一些免费API,例如ipify.org等来获取IP地址。下面的代码片段展

    2024年02月04日
    浏览(52)
  • java获取本机ip的方法

      Java中有一个类叫 Application,可以用来获取本机 ip,也可以用来获取网络连接的信息,例如网络上有什么主机、需要访问本机的主机名等。但是这个类只能在本机上使用,如果要访问外部的主机,还需要使用其它的方法。 首先在主程序中写一个 java. util. Application ()方法,

    2024年02月02日
    浏览(58)
  • vue前端获取本地IP地址

    新建js文件 getIpAddress.js 在index.js文件中添加以下配置

    2024年04月29日
    浏览(42)
  • QT 中获取本机ip的方法

    在使用tcp时绑定自己的端口号时,每次都要手动输入或者在代码编写的时候固定死。就在想有没有便捷的方法,于是我便找到了一种不太美好的解决方法: 这样在我现在的电脑上运行可以自动获取到了。但是每台电脑上,ip地址的顺序可能略有不同,所以程序再换一个机子运行

    2024年02月11日
    浏览(44)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包