vue獲取內(nèi)外網(wǎng)ip地址

1.獲取外網(wǎng)ip

2.獲取內(nèi)網(wǎng)ip

首先應(yīng)該設(shè)置瀏覽器設(shè)置，因?yàn)闉g覽器會(huì)默認(rèn)阻止用戶(hù)獲取本地ip

谷歌瀏覽器：地址欄輸入chrome://flags/#enable-webrtc-hide-local-ips-with-mdns，找到Anonymize local IPs exposed by WebRTC.

修改成上圖即可，然后重啟瀏覽器。

然后代碼中寫(xiě)入方法：

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('內(nèi)網(wǎng)ip',displayAddrs[0]); //打印出內(nèi)網(wǎng)ip_this.$cookie.set('ip', displayAddrs[0])// _this.user.ip_in = displayAddrs[0];//獲取內(nèi)網(wǎng)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(“請(qǐng)使用主流瀏覽器：chrome,firefox,opera,safari”);
}
},
然后再調(diào)用。我這里是直接存在cookie中，所以直接執(zhí)行方法，然后再要是用的地方直接獲取所存的cookie即可。

this.getIPs()
let ip = this.$cookie.get(‘ip’)
注意：每個(gè)瀏覽器的ip權(quán)限設(shè)置有可能不同，本人用的谷歌瀏覽器，所以本文只有谷歌的設(shè)置，其他瀏覽器的設(shè)置方法可以自行百度，或者自行研究。

轉(zhuǎn)載自：https://blog.csdn.net/zhjyyw/article/details/125895907

獲取本地IP地址
IP地址需要通過(guò)js獲取：

網(wǎng)上有很多查詢(xún)接口可以獲取到IP，查到的搜狐的比較多，我這里就用搜狐的：

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

1、在瀏覽器中
直接輸入這個(gè)地址，就可以獲取到ip信息：

在這里插入圖片描述

2、在vue文件中,實(shí)現(xiàn)如下
（1）在config/index.js中 proxyTable:{ } ,在里面添加代理規(guī)則

‘/api’: {
target: ‘http://pv.sohu.com’,//這里是域名，不是完整地址
changeOrigin: true,//是否跨域
pathRewrite: {
‘^/api’: ‘’
}
}
target: 'http://'接口的域名,注意這里是域名，不是完整的ip;
secure: false, // 如果是https接口，需要配置這個(gè)參數(shù);
changeOrigin:true,// 如果接口跨域，需要進(jìn)行這個(gè)參數(shù)配置;
注意：

‘/api’ 為匹配項(xiàng)，target 為被請(qǐng)求的地址，因?yàn)樵?ajax 的 url 中加了前綴 ‘/api’，而原本的接口是沒(méi)有這個(gè)前綴的，所以需要通過(guò) pathRewrite 來(lái)重寫(xiě)地址，將前綴 ‘/api’ 轉(zhuǎn)為 ‘/’。如果本身的接口地址就有 ‘/api’ 這種通用前綴，就可以把 pathRewrite 刪掉。

（2）具體使用，我在里是用已經(jīng)封裝好的axios

（3）此處獲取到的地址為外網(wǎng)地址：

獲取本地內(nèi)網(wǎng)IP
在項(xiàng)目的config/index.js下插入代碼

const os = require(‘os’);

function getNetworkIp() {
let needHost = ‘’; // 打開(kāi)的host
try {
// 獲得網(wǎng)絡(luò)接口列表
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的主頁(yè)中插入以下代碼：

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

轉(zhuǎn)載自：https://www.qb5200.com/article/483669.html

總結(jié)

以上是生活随笔為你收集整理的vue获取内外网ip地址的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。