JavaScript 获取本机 IP 地址的三种常用方法
本文介绍前端获取客户端 IP 地址的三种方式:通过第三方 API 如 ipify.org 直接请求、利用 WebRTC 创建数据通道获取本地候选地址,以及使用 XMLHttpRequest 进行 DNS 相关查询。每种方法均提供具体代码示例与注意事项,帮助开发者根据实际需求选择合适方案。
在前端开发中,获取客户端的本机 IP 地址是一个常见需求。
目前,JavaScript 提供了多种技术手段来实现这一目标。
以下将详细介绍三种主流的获取本机 IP 地址的方法。
方法一:调用第三方 API
获取客户端 IP 最简单且直观的方式是利用第三方提供的 API 服务。
开发者可以使用诸如 ipify.org 等免费接口来获取目标 IP 信息。
以下代码片段演示了如何结合 JavaScript 与 API 完成本机 IP 的获取。
fetch('https://api.ipify.org?format=json')
.then(response => response.json())
.then(json => console.log(json.ip));
方法二:利用 WebRTC(需用户授权)
WebRTC 是一项 JavaScript API,旨在实现浏览器间的数据直接传输。
该技术同样可用于提取客户端的 IP 地址信息。
相较于调用外部 API,此方法通常具有更快的响应速度和更高的可靠性。
以下是利用 WebRTC 技术获取 IP 地址的具体代码示例。
var myPeerConnection = window.RTCPeerConnection || window.mozRTCPeerConnection || window.webkitRTCPeerConnection;
var pc = new myPeerConnection({iceServers:[]}), noop = function(){};
var localIPs = {};
pc.createDataChannel("");
pc.createOffer().then(function (sdp) {
sdp.sdp.split('\n').forEach(function (line) {
if (line.indexOf('candidate') < 0) return;
line.match(ipRegex).forEach(function (ip) {
localIPs[ip] = true;
});
});
pc.setLocalDescription(sdp, noop, noop);
}).catch(function (reason) {
console.log(reason);
});
var ipRegex = /([0-9]{1,3}(\.[0-9]{1,3}){3})/;
var ips = Object.keys(localIPs);
console.log(ips[0]);方法三:执行 DNS 查询
DNS(域名系统)负责将主机名解析为对应的 IP 地址。
通过 JavaScript 发起 DNS 查询,亦可获取本机 IP 地址。
下面展示了如何使用 JavaScript 执行 DNS 查询的示例代码。
var request = new XMLHttpRequest();
request.open('GET', 'https://api.ipify.org?format=json', true);
request.onload = function () {
if (request.status >= 200 && request.status < 400) {
var data = JSON.parse(request.responseText);
console.log(data.ip);
}
};
request.onerror = function () {
console.error('Error occurred during the network request');
};
request.send();总结
以上为个人经验分享,旨在提供参考,欢迎支持本站。
JavaScript闭包与类(Class)的区别及适用场景对比
2026-11-05 15:48:57
JavaScript入门要学ES6吗?let与箭头函数等新特性解析
2026-11-05 14:49:16
JavaScript 8种数据类型详解:基本类型与引用类型的区别
2026-11-05 14:25:15
怎么在JavaScript中使用async/await优化Ajax异步流程
2026-11-05 13:56:15
JavaScript replace回调函数实现动态正则替换逻辑
2026-11-05 13:52:13
