JavaScript获取本机IP地址三种常用方式

 更新时间:2023年12月09日 08:44:59   作者:半兽先生  
在浏览器中使用JavaScript获取本机IP地址是不可行的,因为浏览器的安全策略禁止JavaScript访问这样的信息,这篇文章主要给大家介绍了关于JavaScript获取本机IP地址的三种常用方式,需要的朋友可以参考下

获取本机IP地址是前端工程师经常需要处理的问题。JavaScript 有几种方法可以获取客户端的IP地址。下面是三种获取本机IP的方法。

方法1:使用第三方 API

一种获取客户端IP地址的最简单方法是使用第三方API。可以使用一些免费API,例如ipify.org等来获取IP地址。下面的代码片段展示了如何使用 JavaScript 和 API 获取本机IP地址。

<code>
fetch('https://api.ipify.org?format=json')
.then(response => response.json())
.then(json => console.log(json.ip));
</code>

方法2:使用 WebRTC(需要用户授权)

WebRTC 是一种 JavaScript API,用于在浏览器之间直接传输数据。它也可以用于获取客户端IP地址。该方法通常比使用API更快速和可靠。以下是一些使用 WebRTC 获取IP地址的代码。

<code>
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]);
</code>

方法3:使用 DNS 查询

DNS 是一种用于解析主机名为 IP 地址的系统。可以使用 JavaScript DNS 查询来获取本机IP地址。下面是如何使用 JavaScript 进行DNS查询的示例代码。

<code>
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();
</code>

总结 

到此这篇关于JavaScript获取本机IP地址三种常用方式的文章就介绍到这了,更多相关JS获取本机IP地址内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • 如何利用Three.js实现web端显示点云数据

    如何利用Three.js实现web端显示点云数据

    这篇文章主要给大家介绍了关于如何利用Three.js实现web端显示点云数据的相关资料,最近在项目中遇到需求,需要在web端显示点云数据,将我的实现步骤介绍在这里供大家参考,需要的朋友可以参考下
    2023-11-11
  • 详解TypeScript中的类型保护

    详解TypeScript中的类型保护

    这篇文章主要介绍了TypeScript中的类型保护,对类型保护感兴趣的同学,可以参考下
    2021-04-04
  • Angular中针对路由Routing原理刨析

    Angular中针对路由Routing原理刨析

    在Angular中,最好在一个顶级模块中加载和配置路由,它专注于路由功能,然后由根模块AppModule导入它,最后还有初始化并监听浏览器的地址变化
    2023-01-01
  • Javascript防止图片拉伸的自适应处理方法

    Javascript防止图片拉伸的自适应处理方法

    这篇文章主要给大家介绍了关于利用Javascript防止图片拉伸的自适应处理方法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧。
    2017-12-12
  • JavaScript 命名空间 使用介绍

    JavaScript 命名空间 使用介绍

    使用JavaScript实现命名空间就没有这么舒服了,Javascript只有函数作用域,什么块儿啊、神马文件啊统统都认为是一个命名空间的,有时候因为一些重名问题导致的错误让人莫名其妙,难以调试解决
    2013-08-08
  • 前端如何写一个大文件上传组件详细步骤

    前端如何写一个大文件上传组件详细步骤

    在现代Web应用中,大文件上传是一个常见的需求,尤其是在云存储、社交媒体和协作平台等领域,这篇文章主要介绍了前端如何写一个大文件上传组件详细步骤,需要的朋友可以参考下
    2025-04-04
  • JS发送请求的常用方法详解

    JS发送请求的常用方法详解

    在Web开发中,JavaScript与服务器进行数据交互是核心需求之一,本文将详细解析JavaScript发送请求的常用方法,帮助开发者根据场景选择最适合的方案,需要的朋友可以参考下
    2026-03-03
  • 微信小程序API—获取定位的详解

    微信小程序API—获取定位的详解

    这篇文章主要介绍了微信小程序API获取定位,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-04-04
  • javascript判断网页是关闭还是刷新

    javascript判断网页是关闭还是刷新

    本篇文章给大家介绍js判断网页是关闭还是刷新,实现原理就是通过离开页面行为时间onunload触发时间去检测此时的浏览器的窗口大小,根据大小由此判断用户是刷新,跳转或是关闭行为程序,需要的朋友可以参考下本文
    2015-09-09
  • JS实现仿UC浏览器前进后退效果的实例代码

    JS实现仿UC浏览器前进后退效果的实例代码

    这篇文章主要介绍了JS实现仿UC浏览器前进后退效果的实例代码,实现此功能前需要先测试下浏览器,具体实例代码,大家参考下本文
    2017-07-07

最新评论