繁体   English   中英

如何使用JavaScript获取客户的IP地址? [关闭]

[英]How to get client's IP address using JavaScript? [closed]

我需要使用 JavaScript 以某种方式检索客户端的 IP 地址; 没有服务器端代码,甚至没有 SSI。

但是,我并不反对使用免费的第 3 方脚本/服务。

我会使用一个可以返回 JSON 的 Web 服务(连同 jQuery 一起让事情变得更简单)。 以下是我能找到的所有可用的免费 IP 查找服务以及它们返回的信息。 如果您知道其他人,请添加评论,我将更新此答案。


抽象的

 let apiKey = '1be9a6884abd4c3ea143b59ca317c6b2'; $.getJSON('https://ipgeolocation.abstractapi.com/v1/?api_key=' + apiKey, function(data) { console.log(JSON.stringify(data, null, 2)); });
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>

限制:

  • 每月 10,000 个请求
  • 需要注册才能获取您的 API 密钥

大数据云

 // Base let apiKey = 'd9e53816d07345139c58d0ea733e3870'; $.getJSON('https://api.bigdatacloud.net/data/ip-geolocation?key=' + apiKey, function(data) { console.log(JSON.stringify(data, null, 2)); });
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>

 // Base + Confidence Area let apiKey = 'd9e53816d07345139c58d0ea733e3870'; $.getJSON('https://api.bigdatacloud.net/data/ip-geolocation-with-confidence?key=' + apiKey, function(data) { console.log(JSON.stringify(data, null, 2)); });
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>

 // Base + Confidence Area + Hazard Report let apiKey = 'd9e53816d07345139c58d0ea733e3870'; $.getJSON('https://api.bigdatacloud.net/data/ip-geolocation-full?key=' + apiKey, function(data) { console.log(JSON.stringify(data, null, 2)); });
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>

限制:

  • 每月 10,000 个请求
  • 需要注册才能获取您的 API 密钥

Cloudflare

 $.get('https://www.cloudflare.com/cdn-cgi/trace', function(data) { // Convert key-value pairs to JSON // https://stackoverflow.com/a/39284735/452587 data = data.trim().split('\n').reduce(function(obj, pair) { pair = pair.split('='); return obj[pair[0]] = pair[1], obj; }, {}); console.log(data); });
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>

限制:

  • 返回纯文本
  • 如果有,则仅返回 IPv6 地址

数据库IP

试试看: https ://api.db-ip.com/v2/free/self

$.getJSON('https://api.db-ip.com/v2/free/self', function(data) {
  console.log(JSON.stringify(data, null, 2));
});

回报:

{
  "ipAddress": "116.12.250.1",
  "continentCode": "AS",
  "continentName": "Asia",
  "countryCode": "SG",
  "countryName": "Singapore",
  "city": "Singapore (Queenstown Estate)"
}

限制:

  • 每天 1,000 个请求
  • 需要非空Origin请求标头

地理字节

试试看: http: //gd.geobytes.com/GetCityDetails

$.getJSON('http://gd.geobytes.com/GetCityDetails?callback=?', function(data) {
  console.log(JSON.stringify(data, null, 2));
});

回报:

{
  "geobytesforwarderfor": "",
  "geobytesremoteip": "116.12.250.1",
  "geobytesipaddress": "116.12.250.1",
  "geobytescertainty": "99",
  "geobytesinternet": "SA",
  "geobytescountry": "Saudi Arabia",
  "geobytesregionlocationcode": "SASH",
  "geobytesregion": "Ash Sharqiyah",
  "geobytescode": "SH",
  "geobyteslocationcode": "SASHJUBA",
  "geobytescity": "Jubail",
  "geobytescityid": "13793",
  "geobytesfqcn": "Jubail, SH, Saudi Arabia",
  "geobyteslatitude": "27.004999",
  "geobyteslongitude": "49.660999",
  "geobytescapital": "Riyadh ",
  "geobytestimezone": "+03:00",
  "geobytesnationalitysingular": "Saudi Arabian ",
  "geobytespopulation": "22757092",
  "geobytesnationalityplural": "Saudis",
  "geobytesmapreference": "Middle East ",
  "geobytescurrency": "Saudi Riyal",
  "geobytescurrencycode": "SAR",
  "geobytestitle": "Saudi Arabia"
}

限制:

  • 每小时 16,384 个请求
  • 免费计划没有 SSL (https)
  • 可以返回错误的位置

GeoIPLookup.io

 $.getJSON('https://json.geoiplookup.io/?callback=?', function(data) { console.log(JSON.stringify(data, null, 2)); });
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>

限制:

  • 每小时 10,000 个请求
  • 免费计划仅用于非商业用途
  • 如果有,则仅返回 IPv6 地址

地理插件

试试看: http ://www.geoplugin.net/json.gp

$.getJSON('http://www.geoplugin.net/json.gp', function(data) {
  console.log(JSON.stringify(data, null, 2));
});

回报:

{
  "geoplugin_request": "116.12.250.1",
  "geoplugin_status": 200,
  "geoplugin_credit": "Some of the returned data includes GeoLite data created by MaxMind, available from <a href=\\'http://www.maxmind.com\\'>http://www.maxmind.com</a>.",
  "geoplugin_city": "Singapore",
  "geoplugin_region": "Singapore (general)",
  "geoplugin_areaCode": "0",
  "geoplugin_dmaCode": "0",
  "geoplugin_countryCode": "SG",
  "geoplugin_countryName": "Singapore",
  "geoplugin_continentCode": "AS",
  "geoplugin_latitude": "1.2931",
  "geoplugin_longitude": "103.855797",
  "geoplugin_regionCode": "00",
  "geoplugin_regionName": "Singapore (general)",
  "geoplugin_currencyCode": "SGD",
  "geoplugin_currencySymbol": "&#36;",
  "geoplugin_currencySymbol_UTF8": "$",
  "geoplugin_currencyConverter": 1.4239
}

限制:

  • 每分钟 120 个请求
  • 免费计划没有 SSL (https)

黑客目标

 $.get('https://api.hackertarget.com/geoip/?q=116.12.250.1', function(data) { // Convert key-value pairs to JSON // https://stackoverflow.com/a/39284735/452587 data = data.trim().split('\n').reduce(function(obj, pair) { pair = pair.split(': '); return obj[pair[0]] = pair[1], obj; }, {}); console.log(data); });
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>

限制:

  • 每天 100 个请求
  • 需要 IP 地址参数
  • 返回纯文本

伊皮皮

试试看: https ://ipapi.co/json/

$.getJSON('https://ipapi.co/json/', function(data) {
  console.log(JSON.stringify(data, null, 2));
});

回报:

{
  "ip": "116.12.250.1",
  "city": "Singapore",
  "region": "Central Singapore Community Development Council",
  "country": "SG",
  "country_name": "Singapore",
  "postal": null,
  "latitude": 1.2855,
  "longitude": 103.8565,
  "timezone": "Asia/Singapore"
}

限制:

  • 每天 1,000 个请求
  • 需要 SSL (https)
  • 需要非空Origin请求标头
  • 如果有,则仅返回 IPv6 地址

IP-API

试试看:http: //ip-api.com/json

$.getJSON('http://ip-api.com/json', function(data) {
  console.log(JSON.stringify(data, null, 2));
});

回报:

{
  "as": "AS3758 SingNet",
  "city": "Singapore",
  "country": "Singapore",
  "countryCode": "SG",
  "isp": "SingNet Pte Ltd",
  "lat": 1.2931,
  "lon": 103.8558,
  "org": "Singapore Telecommunications",
  "query": "116.12.250.1",
  "region": "01",
  "regionName": "Central Singapore Community Development Council",
  "status": "success",
  "timezone": "Asia/Singapore",
  "zip": ""
}

限制:

  • 每分钟 150 个请求
  • 免费计划没有 SSL (https)

数据

 let apiKey = 'be0f755b93290b4c100445d77533d291763a417c75524e95e07819ad'; $.getJSON('https://api.ipdata.co?api-key=' + apiKey, function(data) { console.log(JSON.stringify(data, null, 2)); });
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>

限制:

  • 每天 1,500 个请求
  • 需要注册才能获取您的 API 密钥
  • 需要 SSL (https)

IP 查找

 let apiKey = '50e887ce-e3bb-4f00-a9b9-667597db5539'; $.getJSON('https://ipfind.co/me?auth=' + apiKey, function(data) { console.log(JSON.stringify(data, null, 2)); });
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>

限制:

  • 每天 300 个请求
  • 需要注册才能获取您的 API 密钥

ipgeolocation

 let apiKey = 'f8e0b361e8f4405c94613ab534959fdf'; $.getJSON('https://api.ipgeolocation.io/ipgeo?apiKey=' + apiKey, function(data) { console.log(JSON.stringify(data, null, 2)); });
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>

限制:

  • 每月 50,000 个请求
  • 需要注册才能获取您的 API 密钥
  • 如果有,则仅返回 IPv6 地址

ipify

 $.getJSON('https://api.ipify.org?format=jsonp&callback=?', function(data) { console.log(JSON.stringify(data, null, 2)); });
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>

限制:

  • 没有任何

IP信息数据库

 let apiKey = '25864308b6a77fd90f8bf04b3021a48c1f2fb302a676dd3809054bc1b07f5b42'; $.getJSON('https://api.ipinfodb.com/v3/ip-city/?format=json&key=' + apiKey, function(data) { console.log(JSON.stringify(data, null, 2)); });
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>

限制:

  • 每秒两个请求
  • 需要注册才能获取您的 API 密钥

ipinfo.io

 $.getJSON('https://ipinfo.io/json', function(data) { console.log(JSON.stringify(data, null, 2)); });
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>

限制:

  • 每月 50,000 个请求

注册中心

 $.getJSON('https://api.ipregistry.co/?key=tryout', function(data) { console.log(JSON.stringify(data, null, 2)); });
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>

限制:

  • 免费计划包括 100,000 个请求
  • 需要注册才能获取您的 API 密钥
  • 如果有,则仅返回 IPv6 地址

ipstack (以前的 freegeoip.net)

试试看: http://api.ipstack.com/ <ip_address> ?access_key= <your_api_key>

$.getJSON('http://api.ipstack.com/<ip_address>?access_key=<your_api_key>', function(data) {
  console.log(JSON.stringify(data, null, 2));
});

回报:

{
  "ip": "116.12.250.1",
  "type": "ipv4",
  "continent_code": "AS",
  "continent_name": "Asia",
  "country_code": "SG",
  "country_name": "Singapore",
  "region_code": "01",
  "region_name": "Central Singapore Community Development Council",
  "city": "Singapore",
  "zip": null,
  "latitude": 1.2931,
  "longitude": 103.8558,
  "location": {
    "geoname_id": 1880252,
    "capital": "Singapore",
    "languages": [
      {
        "code": "en",
        "name": "English",
        "native": "English"
      },
      {
        "code": "ms",
        "name": "Malay",
        "native": "Bahasa Melayu"
      },
      {
        "code": "ta",
        "name": "Tamil",
        "native": "தமிழ்"
      },
      {
        "code": "zh",
        "name": "Chinese",
        "native": "中文"
      }
    ],
    "country_flag": "http://assets.ipstack.com/flags/sg.svg",
    "country_flag_emoji": "🇸🇬",
    "country_flag_emoji_unicode": "U+1F1F8 U+1F1EC",
    "calling_code": "65",
    "is_eu": false
  }
}

限制:

  • 每月 10,000 个请求
  • 需要 IP 地址参数
  • 需要注册才能获取您的 API 密钥
  • 免费计划没有 SSL (https)

jsonip.com

 $.getJSON('https://jsonip.com/', function(data) { console.log(JSON.stringify(data, null, 2)); });
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>

限制:

  • 如果有,则仅返回 IPv6 地址

JSON 测试

试试看:http: //ip.jsontest.com/

$.getJSON('http://ip.jsontest.com/', function(data) {
  console.log(JSON.stringify(data, null, 2));
});

回报:

{
  "ip": "116.12.250.1"
}

限制:

  • 无 SSL (https)
  • 如果有,则仅返回 IPv6 地址

史努比

 let apiKey = 'ed5ebbeba257b8f262a6a9bbc0ec678e'; $.getJSON('https://api.snoopi.io/116.12.250.1?apikey=' + apiKey, function(data) { console.log(JSON.stringify(data, null, 2)); });
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>

限制:

  • 每月 10,000 个请求
  • 每 2 秒 1 个请求
  • 需要 IP 地址参数
  • 需要注册才能获取您的 API 密钥

香草 JAVASCRIPT

在现代浏览器中,您可以使用原生Fetch API而不是依赖 jQuery 的$.getJSON() 这是一个例子:

 let apiKey = '1be9a6884abd4c3ea143b59ca317c6b2'; // Make the request fetch('https://ipgeolocation.abstractapi.com/v1/?api_key=' + apiKey) // Extract JSON body content from HTTP response .then(response => response.json()) // Do something with the JSON data .then(data => { console.log(JSON.stringify(data, null, 2)) });

笔记

  • 由于这些都是免费服务,谁知道它们何时/是否会在路上下线(图表 A: Telize )。
  • 如果您想要更多功能和稳定性,这些服务中的大多数还提供付费层。
  • 正如@skobaljic 在下面的评论中指出的那样,请求配额主要是学术性的,因为呼叫发生在客户端,大多数最终用户永远不会超过他们的配额。
  • 某些服务没有可运行的代码片段,因为它们在免费计划中不允许 SSL 连接或需要非空的Origin请求标头(StackOverflow 代码片段被迫使用 https 并在请求标头中有Origin: null )。

更新

  • 2/1/2016:删除Telize (不再提供免费计划)
  • 2016 年 4 月 18 日:删除freegeoip.net (停止服务)
  • 2016 年 4 月 26 日:添加了 DB-IP
  • 2016 年 4 月 26 日:添加了黑客目标
  • 2016 年 7 月 6 日:恢复freegeoip.net
  • 2016 年 7 月 6 日:删除ip-json.rhcloud.com (死链接)
  • 2016 年 12 月 21 日:删除了黑客目标(停止服务)
  • 2017 年 2 月 10 日:添加了 Nekudo
  • 2017 年 4 月 20 日:添加了 ipapi (感谢 Ahmad Awais)
  • 2017 年 4 月 24 日:恢复黑客目标
  • 2017 年 4 月 24 日:删除Snoopi.io (停止服务)
  • 2017 年 7 月 16 日:添加了限制“免费计划没有 SSL (https)”
  • 2017 年 7 月 16 日:添加了IP 查找(感谢 JordanC)
  • 2017 年 9 月 25 日:添加了 Stupid Web 工具(感谢 Cœur)
  • 2018 年 3 月 16 日:添加了 ipdata (感谢 Jonathan)
  • 2018 年 4 月 14 日:将 freegeoip.net 重命名为ipstack (感谢 MA-Maddin)
  • 2018 年 4 月 16 日:添加GeoIPLookup.io (感谢 Rob Waa)
  • 2018 年 6 月 11 日:添加了 ipgeolocation (感谢 Ejaz Ahmed)
  • 2019 年 7 月 31 日:添加了 ipregistry (感谢 Laurent)
  • 2019 年 8 月 16 日:添加SmartIP.io (感谢 kevinj)
  • 2019 年 8 月 22 日:删除了Stupid Web Tools (停止服务)
  • 2019 年 12 月 10 日:添加了 Cloudflare
  • 2020 年 1 月 9 日:删除SmartIP.io (停止服务)
  • 2020 年 11 月 6 日:添加摘要
  • 2020 年 11 月 13 日:添加了 AstroIP.co
  • 2021 年 4 月 13 日:用片段替换代码示例(接近 30k 字符限制)
  • 2021 年 4 月 13 日:添加了将键值对转换为 JSON 以用于纯文本响应的代码
  • 2021 年 4 月 13 日:添加了限制“需要非空Origin请求标头”
  • 2021 年 4 月 13 日:添加了 BigDataCloud
  • 2021 年 4 月 13 日:恢复Snoopi.io
  • 2021 年 4 月 13 日:删除AstroIP.co (停止服务)
  • 2021 年 4 月 13 日:移除Nekudo (现在是 ipapi 的一部分)

2021 年更新:

正如最近一个新的 Github 存储库webrtc-ip所示,您现在可以使用 WebRTC 泄露用户的公共IP 地址。 遗憾的是,由于逐渐转向 mDNS(至少对于 WebRTC 而言),此泄漏不适用于私有 IP, 此处已完全解释。 但是,这是一个工作演示:

 getIPs().then(res => document.write(res.join('\n')))
 <script src="https://cdn.jsdelivr.net/gh/joeymalvinni/webrtc-ip/dist/bundle.dev.js"></script>

可以在此处找到此存储库的已编译源代码。




(以前)最终更新

此解决方案将不再有效,因为浏览器正在修复 webrtc 泄漏:有关更多信息,请阅读另一个问题: RTCIceCandidate 不再返回 IP


更新:我一直想做一个最小/丑化版本的代码,所以这里是一个 ES6 Promise 代码:

 var findIP = new Promise(r=>{var w=window,a=new (w.RTCPeerConnection||w.mozRTCPeerConnection||w.webkitRTCPeerConnection)({iceServers:[]}),b=()=>{};a.createDataChannel("");a.createOffer(c=>a.setLocalDescription(c,b,b),b);a.onicecandidate=c=>{try{c.candidate.candidate.match(/([0-9]{1,3}(\.[0-9]{1,3}){3}|[a-f0-9]{1,4}(:[a-f0-9]{1,4}){7})/g).forEach(r)}catch(e){}}}) /*Usage example*/ findIP.then(ip => document.write('your ip: ', ip)).catch(e => console.error(e))

注意:如果您想要用户的所有 IP(可能更多取决于他的网络),这个新的缩小代码将只返回单个 IP,请使用原始代码...


感谢WebRTC ,在支持 WebRTC 的浏览器中获取本地 IP 非常容易(至少现在是这样)。 我修改了源代码,减少了行数,没有发出任何 stun 请求,因为您只需要本地 IP,而不是公共 IP,以下代码适用于最新的 Firefox 和 Chrome,只需运行代码段并自行检查:

 function findIP(onNewIP) { // onNewIp - your listener function for new IPs var myPeerConnection = window.RTCPeerConnection || window.mozRTCPeerConnection || window.webkitRTCPeerConnection; //compatibility for firefox and chrome var pc = new myPeerConnection({iceServers: []}), noop = function() {}, localIPs = {}, ipRegex = /([0-9]{1,3}(\.[0-9]{1,3}){3}|[a-f0-9]{1,4}(:[a-f0-9]{1,4}){7})/g, key; function ipIterate(ip) { if (!localIPs[ip]) onNewIP(ip); localIPs[ip] = true; } pc.createDataChannel(""); //create a bogus data channel pc.createOffer(function(sdp) { sdp.sdp.split('\n').forEach(function(line) { if (line.indexOf('candidate') < 0) return; line.match(ipRegex).forEach(ipIterate); }); pc.setLocalDescription(sdp, noop, noop); }, noop); // create offer and set local description pc.onicecandidate = function(ice) { //listen for candidate events if (!ice || !ice.candidate || !ice.candidate.candidate || !ice.candidate.candidate.match(ipRegex)) return; ice.candidate.candidate.match(ipRegex).forEach(ipIterate); }; } var ul = document.createElement('ul'); ul.textContent = 'Your IPs are: ' document.body.appendChild(ul); function addIP(ip) { console.log('got ip: ', ip); var li = document.createElement('li'); li.textContent = ip; ul.appendChild(li); } findIP(addIP);
 <h1> Demo retrieving Client IP using WebRTC </h1>

这里发生的情况是,我们正在创建一个虚拟对等连接,并且为了让远程对等连接我们,我们通常会相互交换 ice 候选者。 并且读取候选冰(从本地会话描述和 onIceCandidateEvent)我们可以知道用户的 IP。

我从哪里获取代码-> Source

您可以使用 JSONP 通过服务器端中继它

在谷歌搜索找到一个时,在 SO 我可以使用客户端 Javascript 执行 DNS 查找(主机名到 IP 地址)吗?

<script type="application/javascript">
    function getip(json){
      alert(json.ip); // alerts the ip address
    }
</script>

<script type="application/javascript" src="http://www.telize.com/jsonip?callback=getip"></script>

注意: telize.com API 已于2015 年 11 月 15 日永久关闭

这里的大多数答案都“解决”了对服务器端代码的需求……点击别人的服务器。 这是一种完全有效的技术,除非您确实需要在不访问服务器的情况下获取 IP 地址。

传统上,如果没有某种插件,这是不可能的(即使那样,如果你在 NAT 路由器后面,你可能会得到错误的 IP 地址),但随着 WebRTC 的出现,实际上可以做到这一点。 .如果您的目标是支持 WebRTC 的浏览器(目前:Firefox、Chrome 和 Opera)。

有关如何使用 WebRTC 检索有用的客户端 IP 地址的详细信息, 请阅读 mido 的答案

别再看了

查看http://www.ipify.org/

根据他们:

  • 您可以无限制地使用它(即使您每分钟处理数百万个请求)。
  • ipify 是完全开源的(查看GitHub 存储库)。

这是一个有效的 JS 示例(与其想知道为什么这个答案的票数这么少,不如自己尝试一下,看看它的实际效果):

<script>
function getIP(json) {
  alert("My public IP address is: " + json.ip);
}
</script>
<script src="https://api.ipify.org?format=jsonp&callback=getIP"></script>

懒得复制/粘贴? 我喜欢。 这是一个💻演示

懒得点击? :O

注意在运行演示之前关闭 Adblock Plus / uBlock & co .. 否则,它将无法正常工作。

我与 IPify 团队无关 我只是觉得有人会为大众提供这样的服务真是太酷了。

你不能。 你得问服务员。

您可以对 hostip.info 或类似服务进行 ajax 调用...

function myIP() {
    if (window.XMLHttpRequest) xmlhttp = new XMLHttpRequest();
    else xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");

    xmlhttp.open("GET","http://api.hostip.info/get_html.php",false);
    xmlhttp.send();

    hostipInfo = xmlhttp.responseText.split("\n");

    for (i=0; hostipInfo.length >= i; i++) {
        ipAddress = hostipInfo[i].split(":");
        if ( ipAddress[0] == "IP" ) return ipAddress[1];
    }

    return false;
}

作为奖励,地理定位信息在同一个调用中返回。

尝试这个
$.get("http://ipinfo.io", function(response) {
    alert(response.ip);
}, "jsonp");

或者

$(document).ready(function () {
    $.getJSON("http://jsonip.com/?callback=?", function (data) {
        console.log(data);
        alert(data.ip);
    });
});

小提琴

您可以为此使用我的服务http://ipinfo.io ,它将为您提供客户端 IP、主机名、地理位置信息和网络所有者。 这是一个记录 IP 的简单示例:

$.get("http://ipinfo.io", function(response) {
    console.log(response.ip);
}, "jsonp");

这是一个更详细的 JSFiddle 示例,它还打印出完整的响应信息,因此您可以查看所有可用的详细信息:http: //jsfiddle.net/zK5FN/2/

在您的页面中包含此代码: <script type="text/javascript" src="http://l2.io/ip.js"></script>

更多文档在这里

这个问题有两种解释。 大多数人将“客户端 IP”解释为 Web 服务器在 LAN 之外和 Internet 上看到的公共 IP 地址。 在大多数情况下,这不是客户端计算机的 IP 地址,但

我需要运行托管我的 JavaScript 软件的浏览器的计算机的真实 IP 地址(它几乎总是位于 NAT 层后面的 LAN 上的本地 IP 地址)。

Mido 在上面发布了一个 FANTASTIC 答案,这似乎是唯一真正提供了客户端 IP 地址的答案。

谢谢你,米多!

但是,呈现的函数是异步运行的。 我需要在我的代码中实际使用 IP 地址,并且通过异步解决方案,我可能会尝试在检索/学习/存储 IP 地址之前使用它。 在使用它们之前,我必须能够等待结果到达。

这是 Mido 函数的“等待”版本。 我希望它可以帮助别人:

 function findIP(onNewIP) { // onNewIp - your listener function for new IPs var promise = new Promise(function (resolve, reject) { try { var myPeerConnection = window.RTCPeerConnection || window.mozRTCPeerConnection || window.webkitRTCPeerConnection; //compatibility for firefox and chrome var pc = new myPeerConnection({ iceServers: [] }), noop = function () { }, localIPs = {}, ipRegex = /([0-9]{1,3}(\.[0-9]{1,3}){3}|[a-f0-9]{1,4}(:[a-f0-9]{1,4}){7})/g, key; function ipIterate(ip) { if (!localIPs[ip]) onNewIP(ip); localIPs[ip] = true; } pc.createDataChannel(""); //create a bogus data channel pc.createOffer(function (sdp) { sdp.sdp.split('\n').forEach(function (line) { if (line.indexOf('candidate') < 0) return; line.match(ipRegex).forEach(ipIterate); }); pc.setLocalDescription(sdp, noop, noop); }, noop); // create offer and set local description pc.onicecandidate = function (ice) { //listen for candidate events if (ice && ice.candidate && ice.candidate.candidate && ice.candidate.candidate.match(ipRegex)) { ice.candidate.candidate.match(ipRegex).forEach(ipIterate); } resolve("FindIPsDone"); return; }; } catch (ex) { reject(Error(ex)); } });// New Promise(...{ ... }); return promise; }; //This is the callback that gets run for each IP address found function foundNewIP(ip) { if (typeof window.ipAddress === 'undefined') { window.ipAddress = ip; } else { window.ipAddress += " - " + ip; } } //This is How to use the Waitable findIP function, and react to the //results arriving var ipWaitObject = findIP(foundNewIP); // Puts found IP(s) in window.ipAddress ipWaitObject.then( function (result) { alert ("IP(s) Found. Result: '" + result + "'. You can use them now: " + window.ipAddress) }, function (err) { alert ("IP(s) NOT Found. FAILED! " + err) } );
 <h1>Demo "Waitable" Client IP Retrieval using WebRTC </h1>

我想说乍得和马耳他有很好的答案。 然而,他们的情况很复杂。 所以我建议我从国家插件的广告中找到的这段代码

<script>
<script language="javascript" src="http://j.maxmind.com/app/geoip.js"></script>
<script language="javascript">
mmjsCountryCode = geoip_country_code();
mmjsCountryName = geoip_country_name();

</script>

没有阿贾克斯。 只是普通的javascripts。 :D

如果你去http://j.maxmind.com/app/geoip.js你会看到它包含

function geoip_country_code() { return 'ID'; }
function geoip_country_name() { return 'Indonesia'; }
function geoip_city()         { return 'Jakarta'; }
function geoip_region()       { return '04'; }
function geoip_region_name()  { return 'Jakarta Raya'; }
function geoip_latitude()     { return '-6.1744'; }
function geoip_longitude()    { return '106.8294'; }
function geoip_postal_code()  { return ''; }
function geoip_area_code()    { return ''; }
function geoip_metro_code()   { return ''; }

它还没有真正回答这个问题,因为

http://j.maxmind.com/app/geoip.js不包含 IP(尽管我打赌它使用 IP 来获取国家/地区)。

但是制作一个弹出类似的 PhP 脚本非常容易

function visitorsIP()   { return '123.123.123.123'; }

做那个。 穿上http://yourdomain.com/yourip.php

然后做

<script language="javascript" src="http://yourdomain.com/yourip.php"></script>

该问题特别提到不要使用第三方脚本。 没有其他办法。 Javascript 无法知道您的 IP。 但是可以通过 javascript 访问的其他服务器也可以正常工作,没有问题。

除非您使用某种外部服务,否则一般不可能。

好吧,我离题了,但我今天也有类似的需求,虽然我无法使用 Javascript 从客户端找到 ID,但我做了以下操作。

在服务器端: -

<div style="display:none;visibility:hidden" id="uip"><%= Request.UserHostAddress %></div>

使用 Javascript

var ip = $get("uip").innerHTML;

我正在使用 ASP.Net Ajax,但您可以使用 getElementById 而不是 $get()。

发生的事情是,我在页面上有一个隐藏的 div 元素,用户的 IP 是从服务器呈现的。 比在 Javascript 中我只加载那个值。

这可能对像你这样有类似要求的人有帮助(比如我,虽然我还没有弄清楚)。

干杯!

有一种更简单且免费的方法,不会向您的访问者征求任何许可。

它包括向http://freegeoip.net/json提交一个非常简单的 Ajax POST 请求。 收到 JSON 格式的位置信息后,您会通过更新页面或重定向到新页面来做出相应的反应。

以下是您提交位置信息请求的方式:

jQuery.ajax( { 
  url: '//freegeoip.net/json/', 
  type: 'POST', 
  dataType: 'jsonp',
  success: function(location) {
     console.log(location)
  }
} );

使用 Smart-IP.net Geo-IP API 例如,通过使用 jQuery:

$(document).ready( function() {
    $.getJSON( "http://smart-ip.net/geoip-json?callback=?",
        function(data){
            alert( data.host);
        }
    );
});

我真的很喜欢api.ipify.org ,因为它同时支持 HTTP 和 HTTPS。

下面是一些使用 jQuery 使用api.ipify.org获取 IP 的示例。

HTTPS 上的 JSON 格式

https://api.ipify.org?format=json

 $.getJSON("https://api.ipify.org/?format=json", function(e) { alert(e.ip); });
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

基于 HTTP 的 JSON 格式

http://api.ipify.org?format=json

 $.getJSON("http://api.ipify.org/?format=json", function(e) { alert(e.ip); });
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

HTTPS 上的文本格式

如果您不想在 JSON 中使用它,那么还有一个通过 HTTPS 的纯文本响应

https://api.ipify.org

HTTP 上的文本格式

还有一个通过 HTTP 的明文响应

http://api.ipify.org

您可以使用userinfo.io javascript 库。

<script type="text/javascript" src="userinfo.0.0.1.min.js"></script>

UserInfo.getInfo(function(data) {
  alert(data.ip_address);
}, function(err) {
  // Do something with the error
});

您还可以使用 requirejs 来加载脚本。

它将为您提供访问者的 IP 地址,以及有关其位置(国家、城市等)的一些数据。 它基于 maxmind geoip 数据库。

免责声明:我写了这个库

首先是实际答案不可能使用纯粹的客户端执行代码来找出您自己的 IP 地址。

但是,您可以向https://hutils.loxal.net/whois发出 GET 请求,然后接收类似的信息来获取客户端的 IP 地址

{
  "ip": "88.217.152.15",
  "city": "Munich",
  "isp": "M-net Telekommunikations GmbH",
  "country": "Germany",
  "countryIso": "DE",
  "postalCode": "80469",
  "subdivisionIso": "BY",
  "timeZone": "Europe/Berlin",
  "cityGeonameId": 2867714,
  "countryGeonameId": 2921044,
  "subdivisionGeonameId": 2951839,
  "ispId": 8767,
  "latitude": 48.1299,
  "longitude": 11.5732,
  "fingerprint": "61c5880ee234d66bded68be14c0f44236f024cc12efb6db56e4031795f5dc4c4",
  "session": "69c2c032a88fcd5e9d02d0dd6a5080e27d5aafc374a06e51a86fec101508dfd3",
  "fraud": 0.024,
  "tor": false
}

使用 jQuery 获取您的 IP

一行JS就可以得到你的公网IP地址? 有一项免费服务可以为您提供此功能,您只需要一个获取请求即可:

   $.get('http://jsonip.com/', function(r){ console.log(r.ip); });

要使上述代码段正常工作,您的浏览器必须支持 CORS(跨域请求共享)。 否则会抛出安全异常。 在旧浏览器中,您可以使用此版本,它使用 JSON-P 请求:

   $.getJSON('http://jsonip.com/?callback=?', function(r){ console.log(r.ip); });

使用ipdata.co

该 API 还提供地理位置数据,并有 10 个全球端点,每个端点每天能够处理超过 8 亿个请求!

此答案使用非常有限的“测试”API 密钥,仅用于测试几个调用。 注册您自己的免费 API 密钥并每天收到多达 1500 个开发请求。

 $.get("https://api.ipdata.co?api-key=test", function (response) { $("#response").html(response.ip); }, "jsonp");
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <pre id="response"></pre>

当我想在 html 页面中存储信息并希望我的 javascript 读取信息而无需实际将参数传递给 javascript 时,我将提供一种我经常使用的方法。 当您的脚本被外部引用而不是内联时,这尤其有用。

但是,它不符合“无服务器端脚本”的标准。 但是,如果您可以在 html 中包含服务器端脚本,请执行以下操作:

在您的 html 页面底部,就在 end body 标记上方制作隐藏标签元素。

您的标签将如下所示:

<label id="ip" class="hiddenlabel"><?php echo $_SERVER['REMOTE_ADDR']; ?></label>

一定要创建一个名为hiddenlabel的类并设置visibility:hidden ,这样就没有人真正看到标签。 您可以通过这种方式在隐藏标签中存储很多东西。

现在,在您的 javascript 中,要检索存储在标签中的信息(在本例中为客户端的 IP 地址),您可以执行以下操作:

var ip = document.getElementById("ip").innerHTML;

现在您的变量“ip”等于 ip 地址。 现在您可以将 ip 传递给您的 API 请求。

* 2 年后编辑 *两个小改进:

我经常使用这种方法,但是调用标签class="data" ,因为它实际上是一种存储数据的方式。 类名“hiddenlabel”是一个愚蠢的名字。

第二个修改是在样式表中,而不是visibility:hidden

.data{
    display:none;
}

...是更好的方法。

Javascript / jQuery 获取客户端的 IP 地址和位置(国家、城市)

您只需要在服务器上嵌入一个带有“src”链接的标签。 服务器将“codehelper_ip”作为 Object / JSON 返回,您可以立即使用它。

// First, embed this script in your head or at bottom of the page.
<script language="Javascript" src="http://www.codehelper.io/api/ips/?js"></script>
// You can use it
<script language="Javascript">
    alert(codehelper_ip.IP);
    alert(codehelper_ip.Country);
</script>

更多信息在Javascript Detect Real IP Address Plus Country

如果您使用的是 jQUery,您可以尝试:

console.log(codehelper_ip); 

它将向您显示有关返回对象的更多信息。

如果你想要回调函数,请试试这个:

// First, embed this script in your head or at bottom of the page.
<script language="Javascript" src="http://www.codehelper.io/api/ips/?callback=yourcallback"></script>
// You can use it
<script language="Javascript">
    function yourcallback(json) {
       alert(json.IP);
     }
</script>

如果你要包含一个文件,你可以做一个简单的 ajax get:

function ip_callback() {
    $.get("ajax.getIp.php",function(data){ return data; }
}

ajax.getIp.php将是这样的:

<?=$_SERVER['REMOTE_ADDR']?>

Appspot.com 回调服务不可用。 ipinfo.io 似乎正在工作。

我做了一个额外的步骤,并使用 AngularJS 检索了所有地理信息。 (感谢 Ricardo)检查一下。

<div ng-controller="geoCtrl">
  <p ng-bind="ip"></p>
  <p ng-bind="hostname"></p>
  <p ng-bind="loc"></p>
  <p ng-bind="org"></p>
  <p ng-bind="city"></p>
  <p ng-bind="region"></p>
  <p ng-bind="country"></p>
  <p ng-bind="phone"></p>
</div>
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script src="http://code.angularjs.org/1.2.12/angular.min.js"></script>
<script src="http://code.angularjs.org/1.2.12/angular-route.min.js"></script>
<script>
'use strict';
var geo = angular.module('geo', [])
.controller('geoCtrl', ['$scope', '$http', function($scope, $http) {
  $http.jsonp('http://ipinfo.io/?callback=JSON_CALLBACK')
    .success(function(data) {
    $scope.ip = data.ip;
    $scope.hostname = data.hostname;
    $scope.loc = data.loc; //Latitude and Longitude
    $scope.org = data.org; //organization
    $scope.city = data.city;
    $scope.region = data.region; //state
    $scope.country = data.country;
    $scope.phone = data.phone; //city area code
  });
}]);
</script>

工作页面在这里: http ://www.orangecountyseomarketing.com/projects/_ip_angularjs.html

没有真正可靠的方法来获取客户端计算机的 IP 地址。

这经历了一些可能性。 如果用户有多个接口,使用 Java 的代码将会中断。

http://nanoagent.blogspot.com/2006/09/how-to-find-evaluate-remoteaddrclients.html

从这里的其他答案看来,您可能想要获取客户端的公共 IP 地址,这可能是他们用来连接互联网的路由器的地址。 这里的许多其他答案都谈到了这一点。 我建议创建和托管您自己的服务器端页面,以接收请求并使用 IP 地址进行响应,而不是依赖于可能会或可能不会继续工作的其他人的服务。

试试这个: http ://httpbin.org/ip(或https://httpbin.org/ip

以 https 为例:

$.getJSON('https://httpbin.org/ip', function(data) {
                console.log(data['origin']);
});

来源: http ://httpbin.org/

如果您在某处使用 NGINX,您可以添加此代码段并通过任何 AJAX 工具询问您自己的服务器。

location /get_ip {
    default_type text/plain;
    return 200 $remote_addr;
}

获取系统本地 IP:

  try {
var 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]; });
        LgIpDynAdd = displayAddrs.join(" or perhaps ") || "n/a";
        alert(LgIpDynAdd)
    }

    function grepSDP(sdp) {
        var hosts = [];
        sdp.split('\r\n').forEach(function (line) {
            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];
                alert(addr);
            }
        });
    }
})();} catch (ex) { }
    $.getJSON("http://jsonip.com?callback=?", function (data) {
        alert("Your ip address: " + data.ip);
    });

您可以通过使用 js 可以调用的 Flash 对象完全在客户端并且主要在 JavaScript 中完成此操作。 Flash可以访问本地机器的 IP 地址,这可能不是很有用。

var call_to = "http://smart-ip.net/geoip-json?callback=?";

$.getJSON(call_to, function(data){
   alert(data.host);
});

data.host是 IP 地址。 只需从您的浏览器中调用它。

http://smart-ip.net/geoip-json?callback=? [不带引号]并获取IP。

您可以使用以下 Web 服务:http: //ip-api.com/

例子:

<script type="text/javascript" src="http://ip-api.com/json/?callback=foo">
<script>
    function foo(json) {
        alert(json.query)
    }
</script>

additional example: http://whatmyip.info    
<!DOCTYPE html>
<html ng-app="getIp">
<body>
    <div ng-controller="getIpCtrl">
        <div ng-bind="ip"></div>
    </div>

    <!-- Javascript for load faster
    ================================================== -->
    <script src="lib/jquery/jquery.js"></script>
    <script src="lib/angular/angular.min.js"></script>
    <script>
    /// Scripts app

    'use strict';

    /* App Module */
    var getIp = angular.module('getIp', [ ]);

    getIp.controller('getIpCtrl', ['$scope', '$http',
      function($scope, $http) {
        $http.jsonp('http://jsonip.appspot.com/?callback=JSON_CALLBACK')
            .success(function(data) {
            $scope.ip = data.ip;
        });
      }]);

    </script>
</body>
</html>
<script type="text/javascript" src="http://l2.io/ip.js?var=myip"></script>
    <script>
        function systemip(){
        document.getElementById("ip").value = myip
        console.log(document.getElementById("ip").value)
        }
    </script>

我在这里看到的其他一些服务的一个问题是它们要么不支持 IPv6,要么在存在 IPv6 的情况下无法预测。

因为我自己在双栈环境中需要此功能,所以我将自己的 IP 地址服务放在一起,您可以在http://myip.addr.space/找到它。 /help也有一个快速参考。

要将它与 jQuery 一起使用,请使用/ip端点。 您将返回包含 IP 地址的纯文本,具体取决于您使用的子域:

$.get("http://myip.addr.space/ip")返回 IPv6 或 IPv4,具体取决于系统可用的内容。 ( JSFiddle )

$.get("http://ipv4.myip.addr.space/ip")总是返回 IPv4(如果没有 IPv4 则失败)。

$.get("http://ipv6.myip.addr.space/ip")总是返回 IPv6(如果没有 IPv6 则失败)。

获取 IP 地址的简单解决方案是在文件中添加以下代码。

  $.getJSON('https://api.ipify.org?format=json', function(data){

   // Your callback functions like   

    console.log(data.ip);
    localStorage.setItem('ip',data.ip);
    alert(data.ip);

  });

它会在页面加载时获取 IP 地址。

您可以尝试使用我们的https://ip-api.io geo ip API。 以 jQuery 为例:

$(document).ready( function() {
    $.getJSON("http://ip-api.io/api/json",
        function(data){
            console.log(data);
        }
    );
});

https://ip-api.io还会检查 TOR、公共代理和垃圾邮件发送者数据库并提供此信息。

示例响应:

{
  "ip": "182.35.213.213",
  "country_code": "US",
  "country_name": "United States",
  "region_code": "CA",
  "region_name": "California",
  "city": "San Francisco",
  "zip_code": "94107",
  "time_zone": "America/Los_Angeles",
  "latitude": 32.7697,
  "longitude": -102.3933,
  "suspicious_factors": {
    "is_proxy": true,
    "is_tor_node": true,
    "is_spam": true,
    "is_suspicious": true // true if any of other fields (is_proxy, is_tor_node, is_spam) is true
  }
}

以上所有答案都有服务器部分,而不是纯客户端部分。 这应该由网络浏览器提供。 目前,没有网络浏览器支持此功能。

但是,对于 Firefox 的这个插件: https ://addons.mozilla.org/en-US/firefox/addon/ip-address/ 您必须要求您的用户安装这个插件。 (这对我来说很好,第 3 方)。

您可以测试用户是否安装了它。

var installed=window.IP!==undefined;

您可以使用 javascript 获取它,如果已安装,则 var ip=IP.getClient(); var IPclient=ip.IP; //而ip.url是url

ip=IP.getServer();
var IPserver=ip.IP;
var portServer=ip.port;
//while ip.url is the url

//or you can use IP.getBoth();

更多信息在这里: http ://www.jackiszhp.info/tech/addon.IP.html

尝试这个

$.get("http://ipinfo.io", function(response) {
   alert(response.ip);
}, "jsonp");
$.getJSON("http://jsonip.com?callback=?", function (data) {
    alert("Your ip: " + data.ip);
});

我有自己的带有 laravel 的 api 后端,所以我通常只是以下内容:

$(document).ready( function() {

    $.getJSON( "http://api.whoisdoma.com/v1/ip/visitor?api_key=key",
        function(data){
          alert( data.ip);
        }
    );

});

为了额外的安全性,我提供了一个获取结果所需的 api 密钥。

用于查找 IP 的 Java 脚本

为了获得 IP 地址,我正在对 Free Web Service 进行 JSON 调用 喜欢

[jsonip.com/json, ipinfo.io/json, www.telize.com/geoip, ip-api.com/json, api.hostip.info/get_json.php]

我正在传递回调函数的名称,该函数将在请求完成时调用。

<script type="text/javascript">
    window.onload = function () {
    var webService = "http://www.telize.com/geoip";
        var script = document.createElement("script");
        script.type = "text/javascript";
        script.src = webService+"?callback=MyIP";
        document.getElementsByTagName("head")[0].appendChild(script);
    };
    function MyIP(response) {
        document.getElementById("ipaddress").innerHTML = "Your IP Address is " + response.ip;
    }
</script>
<body>
    <form>
        <span id = "ipaddress"></span>
    </form>
</body>

对于 xml 响应代码

不需要服务器支持的WebRTC

我不是 javascript 大师,但如果可能的话,您可以打开一个以http://www.whatismyip.com/automation/n09230945.asp作为源的 iframe 并阅读框架的内容。

编辑:由于跨域安全性,这将不起作用。

它不能单独使用 Javascript 完成(除非客户端具有如上所述的浏览器插件)。 客户端上的 Flash 也无法完成。 但它可以在客户端上使用 Java 小程序完成(并且 javascript 可以与之对话),尽管它会提示提供完整权限。 例如参见http://www.findmyrouter.net

好吧,如果在 HTML 中导入脚本...

<script type="text/javascript" src="//stier.linuxfaq.org/ip.php"></script>

然后,您可以在页面上的任何位置使用变量 userIP(这将是访问者的 IP 地址)。

重定向:

<script>
if (userIP == "555.555.555.55") {window.location.replace("http://192.168.1.3/flex-start/examples/navbar-fixed-top/");}
</script>

或者在页面上显示: document.write (userIP);

免责声明:我是我说要导入的脚本的作者。 该脚本使用 PHP 提供 IP。 该脚本的源代码如下。

<?php 
//Gets the IP address
$ip = getenv("REMOTE_ADDR") ; 
Echo "var userIP = '" . $ip . "';"; 
?>
<script type="application/javascript">
  function getip(json)
  {
     alert(json.ip); 
  }

 <script type="application/javascript" src="http://jsonip.appspot.com/?callback=getip"></script>

运行上面的脚本点击这里

您可以使用telize的 api 服务

如果您只需要客户端的公共 ip,请执行以下操作:

var ip = "http://www.telize.com/ip";
var response = http.request({url: ip});

如果你想要更多的细节,比如位置和东西,你可以这样做:

var ipAndGeoDetails = "http://www.telize.com/geoip/"
var response = http.request({url: ipAndGeoDetails});

注意:telize 的公共 API 将于 2015 年 11 月 15 日永久关闭。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM