前端获取内网IP

个人blog,欢迎关注加收藏

前端获取内网IP:

  1. 定义函数:
//获取内网ip
        getIPs(){
            let _this = this;
            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--;
                        }
                    }
                    console.log('内网ip',displayAddrs[0]);      //打印出内网ip
                    _this.user.ip_in = displayAddrs[0];//获取内网ip
                }
                
                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{
                console.log("请使用主流浏览器:chrome,firefox,opera,safari");
            }
        },
  1. 调用函数:
  mounted(){
        let _this = this;
      _this.getIPs();//获取内网ip
  }

前端获取外网IP:

//index.html
<script src="http://pv.sohu.com/cityjson?ie=utf-8"></script>
//vue组件的js:
<script>
document.write(returnCitySN["cip"]);
let ip_out = returnCitySN["cip"];//获取外网IP

login(){
    let _this = this;
    _this.user.ip_out = ip_out;
}
</script>

vue项目中:
cdn方式引入的话
首先有一点要求, script 必须在 index.html 中的

上面
在 main.js 中 通过 window 获取对象

const Foo = window.foo
Vue.prototype.Foo = Foo
vue 文件里:

this.Foo(params)

  • 0
    点赞
  • 17
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值