¿Cómo obtener la dirección IP del cliente usando JavaScript?


560

Necesito recuperar de alguna manera la dirección IP del cliente usando JavaScript; sin código del lado del servidor, ni siquiera SSI.

Sin embargo, no estoy en contra de usar un script / servicio gratuito de terceros.

Respuestas:


774

Usaría un servicio web que puede devolver JSON (junto con jQuery para simplificar las cosas). A continuación se encuentran todos los servicios de búsqueda de IP activos gratuitos que pude encontrar y la información que devuelven. Si conoce más, agregue un comentario y actualizaré esta respuesta.


Flama de nube

Pruébelo: https://www.cloudflare.com/cdn-cgi/trace

// If your site is on Cloudflare, then you can use '/cdn-cgi/trace' instead
$.get('https://www.cloudflare.com/cdn-cgi/trace', function(data) {
    console.log(data)
})

Devoluciones:

fl=4f422
h=www.cloudflare.com
ip=54.193.27.106
ts=1575967108.245
visit_scheme=https
uag=Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/74.0.3729.169 Safari/537.36 Hypothesis-Via
colo=SJC
http=http/1.1
loc=US
tls=TLSv1.3
sni=plaintext
warp=off

Limitaciones:

  • Devuelve texto sin formato

DB-IP

Pruébelo: http://api.db-ip.com/addrinfo?api_key= < su clave de API > & addr = < dirección IP >

Devoluciones:

{
  "address": "116.12.250.1",
  "country": "SG",
  "stateprov": "Central Singapore",
  "city": "Singapore"
}

Limitaciones:

  • 2,500 solicitudes por día
  • No admite devoluciones de llamada JSONP
  • Requiere parámetro de dirección IP
  • Requiere una dirección de correo electrónico para obtener su clave API
  • Sin SSL (https) con el plan gratuito

Geobytes

Pruébelo: http://gd.geobytes.com/GetCityDetails

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

Devoluciones:

{
  "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"
}

Limitaciones:

  • 16,384 solicitudes por hora
  • Sin SSL (https) con el plan gratuito
  • Puede devolver la ubicación incorrecta (estoy en Singapur, no en Arabia Saudita)

GeoIPLookup.io

Pruébalo: https://json.geoiplookup.io/api

$.getJSON('https://json.geoiplookup.io/api?callback=?', function(data) {
  console.log(JSON.stringify(data, null, 2));
});

Devoluciones:

{
    "ip": "116.12.250.1",
    "isp": "SGPOST",
    "org": "Singapore Post Ltd",
    "hostname": "116.12.250.1",
    "longitude": "103.807",
    "latitude": "1.29209",
    "postal_code": "",
    "city": "Singapore",
    "country_code": "SG",
    "country_name": "Singapore",
    "continent_code": "AS",
    "region": "Central Singapore",
    "district": "",
    "timezone_name": "Asia\/Singapore",
    "connection_type": "",
    "asn": "AS3758 SingNet",
    "currency_code": "SGD",
    "currency_name": "Singapore Dollar",
    "success": true
}

Limitaciones:

  • 10,000 solicitudes por hora
  • La API gratuita solo permite el uso no comercial

geoPlugin

Pruébalo: http://www.geoplugin.net/json.gp

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

Devoluciones:

{
  "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
}

Limitaciones:

  • 120 solicitudes por minuto
  • Sin SSL (https) con el plan gratuito

Hacker Target

Pruébelo: https://api.hackertarget.com/geoip/?q= < dirección IP >

Devoluciones:

IP Address: 116.12.250.1
Country: SG
State: N/A
City: Singapore
Latitude: 1.293100
Longitude: 103.855797

Limitaciones:

  • 50 solicitudes por día
  • No admite devoluciones de llamada JSONP
  • Requiere parámetro de dirección IP
  • Devuelve texto sin formato

ipapi.co

Pruébalo: https://ipapi.co/json/

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

Devoluciones:

{
  "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"
}

Limitaciones:

  • 1,000 solicitudes por día
  • Requiere SSL (https)

IP-API.com

Pruébalo: http://ip-api.com/json

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

Devoluciones:

{
  "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": ""
}

Limitaciones:

  • 150 solicitudes por minuto
  • Sin SSL (https) con el plan gratuito

Ipdata.co

Pruébalo: https://api.ipdata.co

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

Devoluciones:

{
  "ip": "116.12.250.1",
  "city": "Singapore",
  "region": "Central Singapore Community Development Council",
  "region_code": "01",
  "country_name": "Singapore",
  "country_code": "SG",
  "continent_name": "Asia",
  "continent_code": "AS",
  "latitude": 1.2931,
  "longitude": 103.8558,
  "asn": "AS3758",
  "organisation": "SingNet",
  "postal": "",
  "calling_code": "65",
  "flag": "https://ipdata.co/flags/sg.png",
  "emoji_flag": "\ud83c\uddf8\ud83c\uddec",
  "emoji_unicode": "U+1F1F8 U+1F1EC",
  "is_eu": false,
  "languages": [
    {
      "name": "English",
      "native": "English"
    },
    {
      "name": "Malay",
      "native": "Bahasa Melayu"
    },
    {
      "name": "Tamil",
      "native": "\u0ba4\u0bae\u0bbf\u0bb4\u0bcd"
    },
    {
      "name": "Chinese",
      "native": "\u4e2d\u6587"
    }
  ],
  "currency": {
    "name": "Singapore Dollar",
    "code": "SGD",
    "symbol": "S$",
    "native": "$",
    "plural": "Singapore dollars"
  },
  "time_zone": {
    "name": "Asia/Singapore",
    "abbr": "+08",
    "offset": "+0800",
    "is_dst": false,
    "current_time": "2018-05-09T12:28:49.183674+08:00"
  },
  "threat": {
    "is_tor": false,
    "is_proxy": false,
    "is_anonymous": false,
    "is_known_attacker": false,
    "is_known_abuser": false,
    "is_threat": false,
    "is_bogon": false
  }
}

Limitaciones:

  • 1,500 solicitudes por día
  • Requiere una dirección de correo electrónico para obtener su clave API
  • Requiere SSL (https)

Búsqueda de IP

Pruébelo: https://ipfind.co/me?auth= < su clave de API >

$.getJSON('https://ipfind.co/me?auth=<your_api_key>', function(data) {
  console.log(JSON.stringify(data, null, 2));
});

Devoluciones:

{
  "ip_address": "116.12.250.1",
  "country": "Singapore",
  "country_code": "SG",
  "continent": "Asia",
  "continent_code": "AS",
  "city": "Singapore",
  "county": null,
  "region": "Central Singapore",
  "region_code": "01",
  "timezone": "Asia/Singapore",
  "owner": null,
  "longitude": 103.8565,
  "latitude": 1.2855,
  "currency": "SGD",
  "languages": [
    "cmn",
    "en-SG",
    "ms-SG",
    "ta-SG",
    "zh-SG"
  ]
}

Limitaciones:

  • 300 solicitudes por día
  • Requiere registro para obtener su clave API

ipgeolocation

Pruébelo: https://api.ipgeolocation.io/ipgeo?apiKey= < su clave de api >

$.getJSON('https://api.ipgeolocation.io/ipgeo?apiKey=<your_api_key>', function(data) {
  console.log(JSON.stringify(data, null, 2));
});

Devoluciones:

{
  "ip": "116.12.250.1",
  "continent_code": "AS",
  "continent_name": "Asia",
  "country_code2": "SG",
  "country_code3": "SGP",
  "country_name": "Singapore",
  "country_capital": "Singapore",
  "state_prov": "Central Singapore",
  "district": "",
  "city": "Singapore",
  "zipcode": "",
  "latitude": "1.29209",
  "longitude": "103.807",
  "is_eu": false,
  "calling_code": "+65",
  "country_tld": ".sg",
  "languages": "cmn,en-SG,ms-SG,ta-SG,zh-SG",
  "country_flag": "https://ipgeolocation.io/static/flags/sg_64.png",
  "isp": "SGPOST",
  "connection_type": "",
  "organization": "Singapore Post Ltd",
  "geoname_id": "1880252",
  "currency": {
    "name": "Dollar",
    "code": "SGD"
  },
  "time_zone": {
    "name": "Asia/Singapore",
    "offset": 8,
    "is_dst": false,
    "current_time": "2018-06-12 09:06:49.028+0800"
  }
}

Limitaciones:

  • 50,000 solicitudes por mes
  • Requiere registro para obtener su clave API

ipify

Pruébalo: https://api.ipify.org/?format=json

$.getJSON('https://api.ipify.org?format=jsonp&callback=?', function(data) {
  console.log(JSON.stringify(data, null, 2));
});

Devoluciones:

{
  "ip": "116.12.250.1"
}

Limitaciones:

  • Ninguna

IPInfoDB

Pruébelo: https://api.ipinfodb.com/v3/ip-city/?key= < your api key > & format = json

$.getJSON('https://api.ipinfodb.com/v3/ip-city/?key=<your_api_key>&format=json&callback=?', function(data) {
  console.log(JSON.stringify(data, null, 2));
});

Devoluciones:

{
  "statusCode": "OK",
  "statusMessage": "",
  "ipAddress": "116.12.250.1",
  "countryCode": "SG",
  "countryName": "Singapore",
  "regionName": "Singapore",
  "cityName": "Singapore",
  "zipCode": "048941",
  "latitude": "1.28967",
  "longitude": "103.85",
  "timeZone": "+08:00"
}

Limitaciones:

  • Dos solicitudes por segundo
  • Requiere registro para obtener su clave API

ipinfo.io

Pruébalo: https://ipinfo.io/json

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

Devoluciones:

{
  "ip": "116.12.250.1",
  "hostname": "No Hostname",
  "city": "Singapore",
  "region": "Central Singapore Community Development Council",
  "country": "SG",
  "loc": "1.2931,103.8558",
  "org": "AS3758 SingNet"
}

Limitaciones:

  • 1,000 solicitudes por día

Ipregistry

Pruébelo: https://api.ipregistry.co/?key= < su clave de api >

$.getJSON('https://api.ipregistry.co/?key=<your_api_key>', function(data) {
  console.log(JSON.stringify(data, null, 2));
});

Devoluciones:

{
  "ip" : "116.12.250.1",
  "type" : "IPv4",
  "hostname" : null,
  "carrier" : {
    "name" : null,
    "mcc" : null,
    "mnc" : null
  },
  "connection" : {
    "asn" : 3758,
    "domain" : "singnet.com.sg",
    "organization" : "SingNet Pte Ltd",
    "type" : "isp"
  },
  "currency" : {
    "code" : "SGD",
    "name" : "Singapore Dollar",
    "plural" : "Singapore dollars",
    "symbol" : "SGD",
    "symbol_native" : "SGD",
    "format" : {
      "negative" : {
        "prefix" : "-SGD",
        "suffix" : ""
      },
      "positive" : {
        "prefix" : "SGD",
        "suffix" : ""
      }
    }
  },
  "location" : {
    "continent" : {
      "code" : "AS",
      "name" : "Asia"
    },
    "country" : {
      "area" : 692.0,
      "borders" : [ ],
      "calling_code" : "65",
      "capital" : "Singapore",
      "code" : "SG",
      "name" : "Singapore",
      "population" : 5638676,
      "population_density" : 8148.38,
      "flag" : {
        "emoji" : "🇸🇬",
        "emoji_unicode" : "U+1F1F8 U+1F1EC",
        "emojitwo" : "https://cdn.ipregistry.co/flags/emojitwo/sg.svg",
        "noto" : "https://cdn.ipregistry.co/flags/noto/sg.png",
        "twemoji" : "https://cdn.ipregistry.co/flags/twemoji/sg.svg",
        "wikimedia" : "https://cdn.ipregistry.co/flags/wikimedia/sg.svg"
      },
      "languages" : [ {
        "code" : "cmn",
        "name" : "cmn",
        "native" : "cmn"
      }, {
        "code" : "en",
        "name" : "English",
        "native" : "English"
      }, {
        "code" : "ms",
        "name" : "Malay",
        "native" : "Melayu"
      }, {
        "code" : "ta",
        "name" : "Tamil",
        "native" : "தமிழ்"
      }, {
        "code" : "zh",
        "name" : "Chinese",
        "native" : "中文"
      } ],
      "tld" : ".sg"
    },
    "region" : {
      "code" : null,
      "name" : "Singapore"
    },
    "city" : "Singapore",
    "postal" : "96534",
    "latitude" : 1.28967,
    "longitude" : 103.85007,
    "language" : {
      "code" : "cmn",
      "name" : "cmn",
      "native" : "cmn"
    },
    "in_eu" : false
  },
  "security" : {
    "is_bogon" : false,
    "is_cloud_provider" : false,
    "is_tor" : false,
    "is_tor_exit" : false,
    "is_proxy" : false,
    "is_anonymous" : false,
    "is_abuser" : false,
    "is_attacker" : false,
    "is_threat" : false
  },
  "time_zone" : {
    "id" : "Asia/Singapore",
    "abbreviation" : "SGT",
    "current_time" : "2019-09-29T23:13:32+08:00",
    "name" : "Singapore Standard Time",
    "offset" : 28800,
    "in_daylight_saving" : false
  }
}

Limitaciones:

  • El plan gratuito incluye 100,000 solicitudes
  • Requiere registro para obtener su clave API

ipstack (anteriormente freegeoip.net)

Pruébelo: http://api.ipstack.com/ < dirección IP >? Access_key = <su clave de API>

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

Devoluciones:

{
    "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": "\u0ba4\u0bae\u0bbf\u0bb4\u0bcd"
        },
        {
            "code": "zh",
            "name": "Chinese",
            "native": "\u4e2d\u6587"
        }],
        "country_flag": "http:\/\/assets.ipstack.com\/flags\/sg.svg",
        "country_flag_emoji": "\ud83c\uddf8\ud83c\uddec",
        "country_flag_emoji_unicode": "U+1F1F8 U+1F1EC",
        "calling_code": "65",
        "is_eu": false
    }
}

Limitaciones:

  • 10,000 solicitudes por mes
  • Requiere parámetro de dirección IP
  • Requiere registro para obtener su clave API
  • Sin SSL (https) con el plan gratuito

jsonip.com

Pruébalo: https://jsonip.com

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

Devoluciones:

{
  "ip": "116.12.250.1",
  "about": "https://jsonip.com/about",
  "Pro!": "http://getjsonip.com",
  "Get Notifications": "https://jsonip.com/notify"
}

Limitaciones:

  • La respuesta incluye ventas adicionales

Prueba JSON

Pruébalo: http://ip.jsontest.com/

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

Devoluciones:

{
  "ip": "116.12.250.1"
}

Limitaciones:

  • Sin SSL (https)
  • Baja mucho (sobre la cuota), por lo que no lo usaría para la producción
  • Devuelve la dirección IPv6 si tiene una, que puede no ser la que desea

Nekudo

Pruébalo: https://geoip.nekudo.com/api

$.getJSON('https://geoip.nekudo.com/api', function(data) {
  console.log(JSON.stringify(data, null, 2));
});

Devoluciones:

{
  "city": "Singapore",
  "country": {
    "name": "Singapore",
    "code": "SG"
  },
  "location": {
    "accuracy_radius": 50,
    "latitude": 1.2855,
    "longitude": 103.8565,
    "time_zone": "Asia/Singapore"
  },
  "ip": "116.12.250.1"
}

Limitaciones:

  • Bloqueado por bloqueadores de anuncios utilizando la lista EasyPrivacy

Tenga en cuenta que, dado que todos estos servicios son gratuitos, su millaje puede variar en términos de exceder la cuota y el tiempo de actividad, y quién sabe cuándo / si se desconectarán en el futuro ( Anexo A: Telize ). La mayoría de estos servicios también ofrecen un nivel de pago en caso de que desee más funciones como el soporte SSL.

Además, como señaló skobaljic en los comentarios a continuación, las cuotas de solicitud son principalmente académicas, ya que esto está sucediendo en el lado del cliente y la mayoría de los usuarios finales nunca excederán la cuota.

ACTUALIZACIONES


3
@AfolabiOlaoluwaAkinwumi puedes probar algo como esto: $.getJSON('//freegeoip.net/json/?callback=?', function(data) { if (!data || !data.ip) alert('IP not found'); }).fail(function() { alert('$.getJSON() request failed'); });
thdoan

1
@skobaljic Re. las limitaciones generalmente no significan nada: Buen punto, y quizás una razón para mantenerse alejado de las que necesitan una clave api, porque se puede contar el uso de la clave .
Nick Rice

2
@JohnWeisz Cierto, pero si el OP simplemente significaba que solo podían actualizar la página y no hacer nada del lado del servidor (no está claro de la pregunta), entonces estas opciones responden bien a la pregunta.
Nick Rice

1
@RobWaa gracias, agregué la limitación del bloqueador de anuncios en la actualización 4/14. Agregaré geoiplookup.io en breve.
Thdoan

1
Todas estas respuestas dependen de un servicio de terceros, lo cual es un gran inconveniente, no solo porque usted depende de que ese servicio responda de manera oportuna, sino porque si no lo hace y no establece un tiempo de espera adecuado (que siempre ocurrir más tarde que tarde), retrasará el tiempo de carga de su página, lo que no es bueno en absoluto. Entonces, ¿por qué no solo usar su propio servidor para devolver la IP del cliente ?, que es BTW una tarea trivial con cualquier lenguaje de programación.
Daniel J.

280

Actualización final

Esta solución ya no funcionaría porque los navegadores están reparando la fuga webrtc: para obtener más información al respecto, lea esta otra pregunta: RTCIceCandidate ya no devuelve IP


Actualización : siempre quise hacer una versión min / uglified del código, así que aquí hay un código de promesa de ES6:

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))

Nota: Este nuevo código minimizado devolvería solo una única IP si desea todas las IP del usuario (que pueden ser más dependientes de su red), use el código original ...


Gracias a WebRTC , es muy fácil obtener IP local en navegadores compatibles con WebRTC (al menos por ahora). Modifiqué el código fuente, reduje las líneas, no hice ninguna solicitud de aturdimiento, ya que solo desea IP local, no la IP pública, el código a continuación funciona en Firefox y Chrome más recientes, solo ejecute el fragmento y verifíquelo usted mismo:

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>

Lo que está sucediendo aquí es que estamos creando una conexión simulada entre pares, y para que el par remoto se comunique con nosotros, generalmente intercambiamos candidatos de hielo entre nosotros. Y leyendo los candidatos de hielo (de la descripción de la sesión local y onIceCandidateEvent) podemos decir la IP del usuario.

de donde tomé el código -> Fuente


12
¡Vota porque la mejor respuesta aquí es obvia, también gracias por el increíble repositorio de GitHub!
kano

28
Advertencia: Esto no muestra su IP pública, solo la red local. No puede usarlo para detectar un país de usuarios, por ejemplo, si están en una LAN
FloatingRock

1
@FloatingRock también puede recuperar la IP pública, usando el servidor STUN (y configurarlo mientras crea el par), luego de nuevo, eso requeriría que mantenga / use un servidor STUN, traiga el código del servidor en la imagen.
mido

10
Esto se conoce como la fuga de WebRTC. Debería ser reparado por todos los navegadores principales, pero no lo es. Más información aquí: privacytools.io/webrtc.html Posiblemente relacionado con el navegador Tor que pierde su IP real.
Kapitein Witbaard

1
Sin embargo, me ha gustado la respuesta, el cliente puede pasar este proceso deshabilitando WebRTC - restoreprivacy.com/webrtc-leaks
ni8mr

175

Puede, retransmitiéndolo a través del servidor con JSONP

Y mientras busco en Google para encontrar uno, lo encontré aquí en SO ¿Puedo realizar una búsqueda de DNS (nombre de host a dirección IP) usando Javascript del lado del cliente?

<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>

Nota: La API de telize.com se cerró permanentemente a partir del 15 de noviembre de 2015 .


45
Si bien aprecio este fragmento, creo que cargar un contenido de texto JavaScript y evaluarlo a través de una función es un grave riesgo de seguridad. ¿Qué pasa si el contenido de la respuesta cambia y todas las más de 100 personas que votaron esta respuesta y posiblemente usaron ese fragmento terminan invocando una función con posible contenido inseguro? Solo usaría esto si fuera una cadena JSON.
auco

32
Error Over Quota This application is temporarily over its serving quota. Please try again later.
Brad M

28
Esta no es una buena respuesta, ya que implica una solicitud del lado del servidor. La pregunta decía claramente "JavaScript puro".
Micah

2
Micah, no hay forma posible de obtener una dirección IP con javascript puro. Le sugiero que lea un poco sobre NAT y cómo funciona. Necesitas un servidor que te haga eco de tu dirección IP de Internet
Chad Grant

11
El servicio ya no funciona.
Cyril N.

109

La mayoría de las respuestas aquí "solucionan" la necesidad de un código del lado del servidor ... Golpeando el servidor de otra persona. Lo cual es una técnica totalmente válida, a menos que realmente necesite obtener la dirección IP sin golpear un servidor.

Tradicionalmente esto no era posible sin una cierta clase de un plugin (y aún así, es probable que obtendría la equivocada dirección IP si estuviera detrás de un router NAT), pero con la llegada de WebRTC en realidad es posible hacer esto .. . Si usted está apuntando navegadores que el apoyo WebRTC (actualmente: Firefox, Chrome y Opera).

Lea la respuesta de mido para obtener detalles sobre cómo puede recuperar direcciones IP de cliente útiles utilizando WebRTC.


23
@oscar: parece ser la misma técnica (IP visible del servidor devuelta por JSONP) que chad mencionó en su respuesta. Lo que no coincide con el requisito del OP de "sin código del lado del servidor". Pero sí, esa es una forma de lograrlo si ignora ese requisito.
Shog9

Esta respuesta no está actualizada debido a WebRTC: stackoverflow.com/questions/20194722/…
Akam

1
Actualizado, @Akam. Debería darle a mido algunos accesorios para señalar esto hace unos meses (después de AÑOS de personas que publicaron respuestas vergonzosamente incorrectas que aún requerían soporte del servidor).
Shog9

¿WebRTC es más ampliamente compatible ahora?
oldboy

1
De acuerdo con ese enlace "CanIUse", es, @BugWhisperer. A menos que necesite IE.
Shog9

81

Puede hacer una llamada ajax a hostip.info o un servicio similar ...

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;
}

Como beneficio adicional, la información de geolocalización se devuelve en la misma llamada.


66
También puede obtener una representación JSON usando api.hostip.info/get_json.php , luego analizar el JSON con la función del navegador, jQuery o Prototype.
Brad Folkens el

2
¿hay algún límite de solicitud en " api.hostip.info/get_html.php "? ¿Dónde puedo ver los detalles de esta API?
Navin Leon

Devuelve la IP del Network Firewall. no la IP del cliente real. ¿Hay alguna manera de que podamos obtener la IP del cliente real?
Leela Addagulla

76
Prueba esto
$.get("http://ipinfo.io", function(response) {
    alert(response.ip);
}, "jsonp");

O

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

Violín


esto funciona $ .get (" ipinfo.io ", function (response) {alert (response.ip);}, "jsonp"); pero, ¿cómo almaceno el valor en una variable? parece desaparecer fuera de este ciclo de solicitud de

1
Para obtener una lista de todos los servicios de búsqueda de IP gratuitos, puede consultar mi respuesta para stackoverflow.com/questions/391979/…
thdoan

¿Cómo envío esta función para devolver el valor de la ip?
Neftali Acosta

67

No puedes Tendrías que preguntarle a un servidor.


55
Esto no proporciona una respuesta a la pregunta. Para criticar o solicitar una aclaración de un autor, deje un comentario debajo de su publicación.
Himanshu

28
Pero lo hace un poco, ¿verdad? Quiero decir, si la respuesta es simplemente "no, no puedes", entonces argumentaría que esta es una respuesta más correcta que la actualmente votada "aquí, usa esta aplicación aleatoria de aplicaciones", que parece ser una respuesta peligrosa. arriba de la lista.
SteveShaffer

16
OMI Esta es la respuesta correcta y debe ser aceptada. La pregunta dice específicamente "sin código del lado del servidor".
matthewwithanm


2
@matthewwithanm No podría estar más de acuerdo. Estaba revisando todas las respuestas para ver si alguien había dicho exactamente esto, y estaba preparado para ofrecerlo como respuesta. Todas las respuestas altamente votadas, aunque informativas, responden a una pregunta diferente. Citando la pregunta: "Necesito extraer de alguna manera la dirección IP del cliente usando JavaScript puro; sin código del lado del servidor, ni siquiera SSI". Esta respuesta es, de hecho, la respuesta correcta. El Javascript protegido por navegador no puede hacer esto (independientemente de NAT o proxies). La pregunta debe cambiarse si se acepta una de las otras respuestas.
wally

64

No busque más

Echa un vistazo a http://www.ipify.org/

Según ellos:

  • Puede usarlo sin límite (incluso si está haciendo millones de solicitudes por minuto).
  • ipify es completamente de código abierto (consulte el repositorio de GitHub ).

Aquí hay un ejemplo de JS que funciona (en lugar de preguntarse por qué esta respuesta tiene tan pocos votos, pruébelo usted mismo para verlo en acción):

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

¿Demasiado perezoso para copiar / pegar? Me gusta. Aquí hay una demostración 💻

¿Demasiado perezoso para hacer clic? :O

Nota : apague Adblock Plus / uBlock & co antes de ejecutar la demostración ... de lo contrario, simplemente no funcionará.

No tengo nada que ver con el equipo de IPify. Simplemente creo que es ridículamente genial que alguien brinde ese servicio por el bien general.


44
La mejor parte es que esto proviene de "https", mientras que mis llamadas a los ayudantes de IP http se bloquearían porque "no son seguras".
Tessa

oye, me está mostrando el error CORS, ¿qué debo hacer?
saberprashant el

@saberprashant ¿estás usando "HTTPS"?
FloatingRock

@FloatingRock, no, estoy usando HTTP
saberprashant

26

Puede usar mi servicio http://ipinfo.io para esto, que le dará la IP del cliente, el nombre de host, la información de geolocalización y el propietario de la red. Aquí hay un ejemplo simple que registra la IP:

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

Aquí hay un ejemplo más detallado de JSFiddle que también imprime la información de respuesta completa, para que pueda ver todos los detalles disponibles: http://jsfiddle.net/zK5FN/2/


Para evitar los problemas Política de contenido mixto, el cambio http://ipinfo.iode //ipinfo.ioo https
Samuel Elh

Queremos utilizar su servicio, ¿tiene alguna oferta de descuento para los usuarios de Stackoverflow?
Mehdi Dehghani el

@MehdiDehghani somos libres por hasta 50k req / mes, por 100k con un vínculo de retroceso - vea ipinfo.io/contact/creditlink
Ben Dowling el

19

Incluya este código en su página: <script type="text/javascript" src="http://l2.io/ip.js"></script>

más doc aquí


1
Hm. Parece interesante ... ¿Algún límite que tengan?
indapublic

1
biblioteca fuera de línea
riccardo.tasso

Hay cierto grado de pop-ups emergentes de spam asociados con l2.io ref: hybrid-analysis.com/sample/… permite incrustar enlaces como en la muestra 117.254.84.212:3000/getjs?nadipdata= "{" url ":" / ip.js? var = myip "," host ":" l2.io "," referer ":" website.com/… } "& screenheight = 768 & screenwidth = 1366 & tm = 1557565256073 & lib = true & fingerprint = c2VwLW5vLXJlZGlyZWN0
Wayne DSouza

16

Yo diría que Chad y Malta tienen una gran respuesta. Sin embargo, los suyos son complicados. Así que sugiero este código que encontré en los anuncios por complemento de país

<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>

No ajax Simplemente javascripts simples. :RE

Si vas a http://j.maxmind.com/app/geoip.js verás que contiene

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 ''; }

Realmente aún no responde la pregunta porque

http://j.maxmind.com/app/geoip.js no contiene la IP (aunque apuesto a que usa la IP para obtener el país).

Pero es tan fácil hacer un script PhP que haga estallar algo como

function visitorsIP()   { return '123.123.123.123'; }

Haz eso. Poner en http://yourdomain.com/yourip.php .

Entonces hazlo

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

La pregunta menciona específicamente NO usar script de terceros. No hay otra manera. Javascript no puede conocer su IP. Pero otros servidores a los que se puede acceder a través de JavaScript pueden funcionar igual de bien sin problemas.


77
cargar un JavaScript desde un servidor remoto e invocar funciones con contenido desconocido me parece un gran riesgo de seguridad (¿y si el contenido de la función cambia?). Prefiero analizar una respuesta JSON.
auco

3
Error 404: Objeto no encontrado
trejder

Ha pasado mucho tiempo. La respuesta es bastante falsa en realidad. No sabía que JavaScript no puede conocer la IP.
user4951

oh, es correcto, la función visitanteIP no está destinada a ser un código php. Es un código javacript generado por código php
user4951

puede usar su propio servidor y luego imprimir un código javascript que asigne ip a los visitantes.
user4951

15

Hay dos interpretaciones a esta pregunta. La mayoría de las personas interpretaron "IP del cliente" como la dirección IP pública que los servidores web ven fuera de la LAN y en Internet. Sin embargo, esta no es la dirección IP de la computadora cliente en la mayoría de los casos

Necesitaba la dirección IP real de la computadora que ejecuta el navegador que aloja mi software JavaScript (que casi siempre es una dirección IP local en una LAN que está detrás de algo de esa capa NAT).

Mido publicó una respuesta FANTÁSTICA, arriba, que parece ser la única respuesta que realmente proporcionó la dirección IP del cliente.

¡Gracias por eso, Mido!

Sin embargo, la función presentada se ejecuta de forma asincrónica. Necesito realmente USAR la dirección IP en mi código, y con una solución asincrónica, podría intentar usar la dirección IP antes de recuperarla / aprenderla / almacenarla. Tenía que poder esperar a que llegaran los resultados antes de usarlos.

Aquí hay una versión "Waitable" de la función de Mido. Espero que ayude a alguien más:

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>


14

Hay un enfoque más fácil y gratuito que no le pedirá permiso a su visitante.

Consiste en enviar una solicitud POST de Ajax muy simple a http://freegeoip.net/json . Una vez que recibe la información de su ubicación, en JSON, reacciona en consecuencia actualizando la página o redirigiendo a una nueva.

Así es como envía su solicitud de información de ubicación:

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

Parece que se
cerraron

13

Bueno, me estoy desviando de la pregunta, pero hoy tenía una necesidad similar y, aunque no pude encontrar la identificación del cliente usando Javascript, hice lo siguiente.

En el lado del servidor: -

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

Usando Javascript

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

Estoy usando ASP.Net Ajax, pero puede usar getElementById en lugar de $ get ().

Lo que sucede es que tengo un elemento div oculto en la página con la IP del usuario renderizada desde el servidor. Que en Javascript acabo de cargar ese valor.

Esto podría ser útil para algunas personas con un requisito similar como el tuyo (como yo, aunque no lo había resuelto).

¡Salud!


20
-1: El OP menciona específicamente "sin código del lado del servidor", sin embargo, utiliza algunos C #.
Bruno Reis

8
¿No sería mejor simplemente dar salida <script>var uip='<%= Request.UserHostAddress %>';</script>?
Chris Haines

aparte de usar el código del lado del servidor, uno nunca debe usar el DOM para almacenar datos. Esto es simplemente malo por todas partes. Hainesy tiene una mejor idea simplemente asignar a JS var.
coblr

13

Con el uso de Smart-IP.net Geo-IP API . Por ejemplo, usando jQuery:

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

15
"Servicio temporalmente no disponible".
Iago

escribió una API simple [ geoip.immanuel.co/myip] para obtener la dirección IP del cliente, SSL habilitado y sin límite
Immanuel


9

Obtenga su IP con jQuery

Puede obtener su dirección IP pública con una línea de JS? Hay un servicio gratuito que ofrece esto para usted y una solicitud de obtención es todo lo que necesita hacer:

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

Para que funcione el fragmento anterior, su navegador tendrá que admitir CORS (intercambio de solicitudes de origen cruzado). De lo contrario, se lanzaría una excepción de seguridad. En navegadores antiguos, puede usar esta versión, que usa una solicitud JSON-P:

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

9

Puede usar la biblioteca javascript userinfo.io .

<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
});

También puede usar requirejs para cargar el script.

Le dará la dirección IP de su visitante, así como algunos datos sobre su ubicación (país, ciudad, etc.). Se basa en la base de datos maxmind geoip.

Descargo de responsabilidad: escribí esta biblioteca


8

Javascript / jQuery obtiene la dirección IP y la ubicación del cliente (país, ciudad)

Solo necesita incrustar una etiqueta con el enlace "src" al servidor. El servidor devolverá "codehelper_ip" como un objeto / JSON, y puede usarlo de inmediato.

// 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>

Más información en Javascript Detect Real IP Address Plus Country

Si está utilizando jQUery, puede probar:

console.log(codehelper_ip); 

Le mostrará más información sobre el objeto devuelto.

Si desea la función de devolución de llamada, intente esto:

// 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>

1
no use languageatributo, use type="text/javascript"en su lugar, más en MDN
Alex K

como @Alex ya mencionó, el idioma está en desuso y solo se usa en código heredado. Utilice 'type = "text / javascript"' para obtener la máxima compatibilidad.
Gautham C.

1
solo para su información: el campo de tipo no es necesario para HTML5 (JS es el valor predeterminado). w3schools.com/tags/att_script_type.asp
pmont

En caso de que se haya perdido estos otros comentarios, debe usar el tipo de
Mike

8

El servicio de devolución de llamada de Appspot.com no está disponible. ipinfo.io parece estar funcionando.

Hice un paso adicional y recuperé toda la información geográfica usando AngularJS. (Gracias a Ricardo) Compruébalo.

<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>

Página de trabajo aquí: http://www.orangecountyseomarketing.com/projects/_ip_angularjs.html


8

Si incluye un archivo de todas formas, puede hacer un simple ajax obtener:

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

Y ajax.getIp.phpsería esto:

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

8

Realmente me gusta api.ipify.orgporque es compatible con HTTP y HTTPS.

Estos son algunos ejemplos de cómo obtener la IP api.ipify.orgutilizando jQuery.

Formato JSON sobre HTTPS

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>

Formato JSON sobre HTTP

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>

Formato de texto sobre HTTPS

Si no lo desea en JSON, también hay una respuesta de texto sin formato sobre HTTPS

https://api.ipify.org

Formato de texto sobre HTTP

Y también hay una respuesta de texto sin formato sobre HTTP

http://api.ipify.org

8

Utiliza ipdata.co .

¡La API también proporciona datos de geolocalización y tiene 10 puntos finales globales, cada uno capaz de manejar> 800M solicitudes por día!

Esta respuesta utiliza una clave API 'prueba' que es muy limitada y solo está destinada a probar algunas llamadas. Regístrese para obtener su propia clave API gratuita y obtenga hasta 1500 solicitudes diarias de desarrollo.

$.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>


7

Realmente no hay una manera confiable de obtener la dirección IP de la computadora cliente.

Esto pasa por algunas de las posibilidades. El código que usa Java se romperá si el usuario tiene múltiples interfaces.

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

Al mirar las otras respuestas aquí, parece que es posible que desee obtener la dirección IP pública del cliente, que probablemente sea la dirección del enrutador que están utilizando para conectarse a Internet. Muchas de las otras respuestas aquí hablan de eso. Recomendaría crear y alojar su propia página del lado del servidor para recibir la solicitud y responder con la dirección IP en lugar de depender del servicio de otra persona que pueda o no continuar funcionando.


7

Voy a ofrecer un método que uso mucho cuando quiero almacenar información en la página html, y quiero que mi javascript lea la información sin tener que pasar parámetros al javascript. Esto es especialmente útil cuando su script se hace referencia externamente, en lugar de en línea.

Sin embargo, no cumple con el criterio de "no script del lado del servidor". Pero si puede incluir secuencias de comandos del lado del servidor en su html, haga lo siguiente:

Cree elementos de etiqueta ocultos en la parte inferior de su página html, justo encima de la etiqueta del cuerpo final.

Su etiqueta se verá así:

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

Asegúrese de hacer una clase llamada hiddenlabely establecer elvisibility:hidden para que nadie vea realmente la etiqueta. Puede almacenar muchas cosas de esta manera, en etiquetas ocultas.

Ahora, en su javascript, para recuperar la información almacenada en la etiqueta (en este caso, la dirección IP del cliente), puede hacer esto:

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

Ahora su variable "ip" es igual a la dirección ip. Ahora puede pasar la ip a su solicitud de API.

* EDITAR 2 AÑOS DESPUÉS * Dos mejoras menores:

Usualmente uso este método, pero llamo a la etiqueta class="data", porque, de hecho, es una forma de almacenar datos. El nombre de la clase "hiddenlabel" es una especie de nombre estúpido.

La segunda modificación está en la hoja de estilo, en lugar de visibility:hidden:

.data{
    display:none;
}

... es la mejor manera de hacerlo.


3
No almacene datos en el DOM. ¿Por qué alguien sugeriría eso, incluso 2 años después? Si puede inyectar lo que sea en el archivo HTML, simplemente inyecte ese valor en una variable JS así. <script> var ip = <? php echo $ _SERVER ['REMOTE_ADDR']; ?> </script>. Al menos, los lectores de pantalla lo perderán y no se requerirá getElementById o $ ('# stupidname').
coblr

@fractalspawn, por la razón de que no puede insertar código php en un archivo .js. No pensé en ESO, ¿sabias pantalones? ;)
TARKUS

Bueno, podría hacerlo si hiciera <script type = "text / javascript" src = "path / to / fancy / javascript.php"> </script> aunque tampoco estoy seguro de por qué haría eso. Mi punto es que si PHP puede insertar algo en el HTML que está representando, la mejor práctica sería hacer que inserte un valor en una variable JS dentro de una etiqueta de script en línea, en lugar de en un elemento DOM que luego tendría que analizar fuera de uso, y podría ser leído por lectores de pantalla a menos que haya tomado medidas adicionales para evitarlo.
coblr

No hay absolutamente ninguna buena razón por la que no pueda o no deba agregar elementos de retención de datos al DOM, y hay muchas buenas razones para hacerlo. De hecho, esas razones están en mi respuesta, si desea leerlo nuevamente. Es confiable, fácil de controlar y especialmente útil cuando su archivo javascript se encuentra en un sitio remoto. Hablando de script remoto, su ejemplo de "javascript.php" es una idea horrible, y de todos modos probablemente no funcionaría. Piense en términos de scripts remotos, como DISQUS.
TARKUS

3
Para su otro comentario sobre por qué el almacenamiento de datos DOM es malo ... bueno, aún puede detener un automóvil golpeando suavemente una pared en su destino, pero ahora hay mejores herramientas para el trabajo. Ahora sabemos mejor y tenemos grandes marcos para aliviar esto. Trabajé en un lugar donde el DOM era solo un gran archivo de configuración para el JS, y fue una pesadilla cuando se rediseñó. Si crees que usar <script src = "something.php"> es un "hack crudo", pero almacenar datos en el DOM que solo tiene valor dentro de Javascript no lo es, entonces me alegra mucho que no trabajemos juntos y de nuevo, con mucho gusto de acuerdo en estar en desacuerdo. :)
coblr

6
    $.getJSON("http://jsonip.com?callback=?", function (data) {
        alert("Your ip address: " + data.ip);
    });


6

En primer lugar, la respuesta real : no es posible utilizar código ejecutado exclusivamente del lado del cliente para averiguar su propia dirección IP.

Sin embargo, puede hacer un GET hacia https://api.muctool.de/whois y recibir algo como obtener la dirección IP de un cliente

{
"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
}

5

Puede hacer esto completamente del lado del cliente y principalmente en JavaScript utilizando un objeto Flash al que js pueda llamar. Flash puede acceder a la dirección IP de la máquina local, lo que puede no ser muy útil.


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

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

data.hostes la dirección ip Simplemente llame a esto desde su navegador.

http://smart-ip.net/geoip-json?callback=? [Sin comillas] y obtenga la ip.


lo siento, ¿qué significa $ en javascript?
FANTASMA
Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.