vue获取内外网ip地址

1.获取外网ip

2.获取内网ip

首先应该设置浏览器设置,因为浏览器会默认阻止用户获取本地ip

谷歌浏览器:地址栏输入chrome://flags/#enable-webrtc-hide-local-ips-with-mdns,找到Anonymize local IPs exposed by WebRTC.

修改成上图即可,然后重启浏览器。

然后代码中写入方法:

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.$cookie.set('ip', displayAddrs[0])// _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”);
}
},
然后再调用。我这里是直接存在cookie中,所以直接执行方法,然后再要是用的地方直接获取所存的cookie即可。

this.getIPs()
let ip = this.$cookie.get(‘ip’)
注意:每个浏览器的ip权限设置有可能不同,本人用的谷歌浏览器,所以本文只有谷歌的设置,其他浏览器的设置方法可以自行百度,或者自行研究。

转载自:https://blog.csdn.net/zhjyyw/article/details/125895907

获取本地IP地址
IP地址需要通过js获取:

网上有很多查询接口可以获取到IP,查到的搜狐的比较多,我这里就用搜狐的:

http://pv.sohu.com/cityjson?ie=utf-8

1、在浏览器中
直接输入这个地址,就可以获取到ip信息:

在这里插入图片描述

2、在vue文件中,实现如下
(1)在config/index.js中 proxyTable:{ } ,在里面添加代理规则

‘/api’: {
target: ‘http://pv.sohu.com’,//这里是域名,不是完整地址
changeOrigin: true,//是否跨域
pathRewrite: {
‘^/api’: ‘’
}
}
target: 'http://'接口的域名,注意这里是域名,不是完整的ip;
secure: false, // 如果是https接口,需要配置这个参数;
changeOrigin:true,// 如果接口跨域,需要进行这个参数配置;
注意:

‘/api’ 为匹配项,target 为被请求的地址,因为在 ajax 的 url 中加了前缀 ‘/api’,而原本的接口是没有这个前缀的,所以需要通过 pathRewrite 来重写地址,将前缀 ‘/api’ 转为 ‘/’。如果本身的接口地址就有 ‘/api’ 这种通用前缀,就可以把 pathRewrite 删掉。

(2)具体使用,我在里是用已经封装好的axios

(3)此处获取到的地址为外网地址:

获取本地内网IP
在项目的config/index.js下插入代码

const os = require(‘os’);

function getNetworkIp() {
let needHost = ‘’; // 打开的host
try {
// 获得网络接口列表
let network = os.networkInterfaces();
// console.log(“network”,network)
for (let dev in network) {

     let iface = network[dev];for (let i = 0; i < iface.length; i++) {let alias = iface[i];if (alias.family === 'IPv4' && alias.address !== '127.0.0.1' && !alias.internal) {needHost = alias.address;// console.log("alias.address",alias.address)}// console.log("alias",alias)}}
} catch (e) {needHost = 'localhost';
}
return needHost;

}
把host按照下图修改:

最后,在需要拿到ip的主页中插入以下代码:

var ip = window.location.host;
console.log(“ip”,ip.split(“:”)[0])

转载自:https://www.qb5200.com/article/483669.html

vue获取内外网ip地址相关推荐

  1. [网络]_获取内外网IP地址【Auto.js】

    auto(); console.show();importClass('java.net.Inet4Address'); importClass('java.net.InetAddress'); im ...

  2. NAT技术配置(内外网IP地址转换)

    NAT技术配置(内外网IP地址转换) 一. 什么是NAT?     NAT是将IP数据报文头中的IP地址转换成另一个IP地址的过程,主要用于实现内部地址(私有IP地址)访问外部地址(公有IP地址)的功 ...

  3. python --获取内网IP地址

    方法一 import socketdef get_local_ip_address():ip_address = ''try:# 获取本机主机名hostname = socket.gethostnam ...

  4. python获取公网ip的几种方式_python获取外网ip地址的方法总结

    本文实例总结了python获取外网ip地址的方法.分享给大家供大家参考.具体如下: 一.利用脚本引擎库直接获取 import console; import web.script import ine ...

  5. 如何从HttpServletRequest中获取外网IP地址

    如何从HttpServletRequest中获取外网IP地址 Java 中可以通过HttpServletRequest类的getRemoteAddr(); //可能是用户真是ip也可能是代理服务器的i ...

  6. 如何获取外网IP地址

    1.  获取外网IP的方法: 获取外网IP地址方法: 访问网站:http://www.3322.org/dyndns/getip 访问网站:http://city.ip138.com/ip2city. ...

  7. 获取外网IP地址API

    1.获取外网IP地址 地址: http://pv.sohu.com/cityjson?ie=utf-8 返回结果: var returnCitySN = {"cip": " ...

  8. Linux命令终端如何查询本机的内外网IP地址

    文章目录 查询本机外网 IP 地址 查询本机内网 IP 地址 查询本机外网 IP 地址 [root@htlwk0001host ~]# curl ifconfig.me # 太慢了,不行[root@h ...

  9. Python定时获取外网IP地址并发送邮件

    去年入手了树莓派4B,放在家里当服务器用.由于电信公网IP经常更换,所以需要定期获取公网IP才能连上. import os import threading from smtplib import S ...

  10. 【node】为vue获取本机IP地址

    获取本机ipv4地址: 可通过cmd,执行ipconfig/all预览本地ip信息: // vue.config.js const os = require("os"); let ...

最新文章

  1. SPI flash配置
  2. ROS限速教程全集很实用
  3. 证明sinx/x的极限等于1(x趋向于0)
  4. MySQL 行锁功过:怎么减少行锁对性能的影响
  5. Windows环境安装Gradle6.4.1
  6. Adobe Illustrator的教程:使用渐变网格工具创建矢量插图
  7. Embedded ProC(嵌入式ProC)与Tuxedo中间件
  8. 关于brvah的setEmptyView功能无法显示问题
  9. jz2440裸机开发与分析:S3c2440代码重定位详解3---链接脚本的解析
  10. HDU 6514 2019中山大学程序设计竞赛(二维前缀和)
  11. web浏览器下载文件没响应不报错
  12. 电脑任务栏应用图标变成白色怎么恢复
  13. java 循环详解_Java for循环详解
  14. 力扣 6009. 使两字符串互为字母异位词的最少步骤数
  15. html5---拖放demo----拖放图片
  16. oracle的date_add,SQL Server 中add函数到 oracle date add的操作
  17. 关于waitKey()函数按键无反应情况
  18. 山西工程技术学院计算机专业在哪个校区,山西工程技术学院有几个校区及校区地址...
  19. 微信公众号都有哪些营销技巧
  20. 虚幻4-初识蓝图“创建新项目及设置自己的游戏模式“

热门文章

  1. opencv项目实践二(银行卡卡号识别)
  2. Android共享元素过渡动画解析
  3. 第一章 古代东方文明
  4. 连接数据库的Provider、Driver等字符串的写法
  5. w10系统可以装2003服务器吗,WMP10如何安装在Win2003系统服务器上
  6. Bugly使用及APP版本更新
  7. 大泡沫.一切从广场协议开始 俞天任 读后总结
  8. 永恒之黑(CVE-2020-0796 微软SMBv3协议远程代码执行漏洞)
  9. Leetcode刷题-459:重复的子字符串
  10. iOS开发之NSLocalizedString,多个本地化语言(Xcode9.2)