vue获取用户ip地址

关注

原创最新推荐文章于 2026-02-27 00:15:47 发布 1w 阅读 AI 写同款· GEO 优化 ›

Vue.js 如何获取本机 IP 地址在 Vue.js 中，要获取本机 IP 地址，你可以使用 JavaScript 来实现。在上述代码中，我们创建了一个 Promise 对象，用于异步获取 IP 地址。首先，你需要在 Vue 组件中创建一个方法，需要在 Vue 组件中创建一个方法，用于获取本机 IP 地址。在这个方法中，我们将使用浏览器提供的 WebRTC API 来获取 IP 地址。最后，你可以在 Vue 组件的模板中显示获取到的 IP 地址。生命周期钩子中调用该方法，并将获取到的 IP 地址存储在组件的数据属性中。在上述代码中，我们在。阅读详情

vue获取用户ip地址（仅限IE浏览器，谷歌无效）
具体代码如下：

/**
	data里定义变量ip
**/
ip = ''

/**
	mounted添加下面方法
**/
this.getUserIP((ip) => {
        this.ip = ip
        console.log('this.ip====', this.ip)
      })
/**
	methods添加下面方法
**/
      // 获取用户本地ip的方法
      getUserIP (onNewIP) {
        let MyPeerConnection = window.RTCPeerConnection || window.mozRTCPeerConnection || window.webkitRTCPeerConnection
        let pc = new MyPeerConnection({
          iceServers: []
        })
        let noop = () => {
          
        }
        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
        let iterateIP = (ip) => {
          if (!localIPs[ip]) onNewIP(ip)
          localIPs[ip] = true
        }
        pc.createDataChannel('')
        pc.createOffer().then((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((reason) => {
        })
        pc.onicecandidate = (ice) => {
          if (!ice || !ice.candidate || !ice.candidate.candidate || !ice.candidate.candidate.match(ipRegex)) return
          ice.candidate.candidate.match(ipRegex).forEach(iterateIP)
        }
      },