使用 jQuery/JS 查找用户位置(没有谷歌地理位置 api)?[复制]

Find user location using jQuery/JS (without google geolocation api)? [duplicate]

提问人:user1530249 提问时间:1/6/2013 最后编辑:user1530249 更新时间:8/31/2018 访问量:89599

问:

有没有办法仅使用jQuery在网站上找到客户位置。例如,如果一个用户来到我的网站,我怎么能用jQuery找出他们的大致位置。例如,如果用户来自加利福尼亚州旧金山,它将具有某种类型标识符,让我知道该用户来自加利福尼亚州旧金山。我真的不需要他们的确切位置,只需要县或一般的原产地。

编辑: http://flourishworks-webutils.appspot.com/req 信息是如何产生的?

谢谢

javascript jquery unobtrusive-javascript

评论

0赞 nnnnnn 1/6/2013
当然,使用 jQuery 的 ESP 插件。但说真的,答案是否定的,你不能只用客户端代码来做到这一点。
0赞 Syon 1/6/2013
您可以使用 GeoLocation,但他们必须批准它,但它仍然不准确。除此之外,据我所知,没有完全证明的客户端方法。
0赞 Matt 1/6/2013
如果你不想使用地理位置API,你可以根据他们的IP地址得到一个非常粗略的估计,但你不能只从jQuery中得到它(你需要服务器合作)。
1赞 zneak 1/6/2013
@nnnnnn,虽然它不适用于所有浏览器和操作系统,但标准的 Javascript、仅限客户端的地理定位 API。但是,它们需要用户批准并且通常很精确,因此对于此问题,它们可能不合适。
0赞 nnnnnn 1/6/2013
@zneak - 真。也许我应该说“......你不能只用客户端代码可靠地做到这一点......”。虽然事实上,据我了解,浏览器可以通过网络服务实现地理定位 API(例如,Chrome 使用 Google 位置服务),因此它们并不是严格意义上的“仅限客户端”,尽管您需要包含在网页上的唯一代码是客户端 JS......

答:

13赞 Julien 1/6/2013 #1

HTML5 地理位置 API 允许您使用一些 JavaScript 获取用户的纬度/经度(如果浏览器兼容,并且用户允许访问他/她的位置)。

然后,您可以对位置进行反向地理编码以获取地址,除了 Google 的 API 之外,还有几种免费的反向地理编码服务。

但是,如果您不需要准确的位置,并且希望所有用户都利用该功能(无论浏览器如何),并且您不想询问他们是否允许您的网站拥有自己的位置,我建议使用用户的 IP 来获取位置

1赞 Lucian 1/11/2013 #2

任何客户端选项都不是一个好主意,因为它们是由计算机基于周围的无线网络提供的。我敢打赌,90% 的桌面用户没有激活此功能。当您访问想要您的位置的网站时,您必须单击一个按钮才能同意。如果他们刚刚进入您的网站,那么他们首先想知道您为什么需要他们的位置。

一个好方法是向他们展示一个页面,告知他们为什么您需要他们的位置,并且您永远不会将其用于指定目的以外的任何其他目的,并且该位置不会保存在您的数据库中。

如果存在运行服务器端的脚本,则存在从客户端到服务器的连接。在这种情况下,服务器必须知道 IP 地址。您可以先采取一些措施来获取 IP 地址。

在您的服务器上创建一个 php 脚本,该脚本将仅返回 IP 地址。由于jquery是在本地处理的,因此当与服务器建立连接时,客户端IP地址将被泄露。建立所需的连接需要一些额外的时间,但很快 IP 地址将在 jQuery 中可用。

然后,您可以通过 jquery 调用外部 API,该 API 将为您提供该特定 IP 地址的信息。要么你购买一个IP数据库并将其安装在你的网络服务器上,这样你就可以调用它,要么你使用另一个API。您可以查看 http://www.ipgp.net/ip-address-geolocation-api/

24赞 Ben Dowling 7/23/2013 #3

您可以使用支持 JSONP 的 Web 服务,例如我的服务 http://ipinfo.io。它将为您提供客户端的 IP 地址、主机名、地理位置信息和网络所有者。下面是jQuery的运行示例:

$.get("http://ipinfo.io", function(response) {
    $("#ip").html(response.ip);
    $("#address").html(response.city + ", " + response.region);
}, "jsonp");

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

评论

3赞 Marko Letic 4/6/2014
这可行,但如果每天有超过 1,000 个 API 请求,就会出现问题。如果您需要提出更多请求,则需要付费。
3赞 Ashutosh Tiwari 12/19/2014 #4
**jQuery(document).ready(function($) {
    jQuery.getScript('http://www.geoplugin.net/javascript.gp', function()
{
    var country = geoplugin_countryName();
    var zone = geoplugin_region();
    var district = geoplugin_city();
    console.log("Your location is: " + country + ", " + zone + ", " + district);
});
});
<script language="JavaScript" src="http://www.geoplugin.net/javascript.gp" type="text/javascript"></script>
<script type="text/javascript">
jQuery(document).ready(function($) {
    alert("Your location is: " + geoplugin_countryName() + ", " + geoplugin_region() + ", " + geoplugin_city());
});
</script>
/*--------------------------------detailed function list not necessarily to be included---------
function geoplugin_city() { return 'Dobroyd Point';}
function geoplugin_region() { return 'New South Wales';}
function geoplugin_regionCode() { return '02';}
function geoplugin_regionName() { return 'New South Wales';}
function geoplugin_areaCode() { return '0';}
function geoplugin_dmaCode() { return '0';}
function geoplugin_countryCode() { return 'AU';}
function geoplugin_countryName() { return 'Australia';}
function geoplugin_continentCode() { return 'OC';}
function geoplugin_latitude() { return '-33.873600';}
function geoplugin_longitude() { return '151.144699';}
function geoplugin_currencyCode() { return 'AUD';}
function geoplugin_currencySymbol() { return '&amp;#36;';}
function geoplugin_currencyConverter(amt, symbol) {
    if (!amt) { return false; }
    var converted = amt * 0.9587170632;
    if (converted &lt;0) { return false; }
    if (symbol === false) { return Math.round(converted * 100)/100; }
    else { return '&amp;#36;'+(Math.round(converted * 100)/100);}
    return false;
} 
*/
//----------------example-----------------------//
<html>
 <head>
  <script language="JavaScript" src="http://www.geoplugin.net/javascript.gp" type="text/javascript"></script>
 </head>
 <body>
  <script language="Javascript">
    document.write("Welcome to our visitors from "+geoplugin_city()+", "+geoplugin_countryName());
  </script>
 </body>
</html>
40赞 Durgesh Pandey 9/24/2015 #5

要在jQuery中获取客户端IP地址和国家/地区名称:

$.getJSON("http://freegeoip.net/json/", function(data) {
    var country_code = data.country_code;
    var country = data.country_name;
    var ip = data.ip;
    var time_zone = data.time_zone;
    var latitude = data.latitude;
    var longitude = data.longitude;

    alert("Country Code: " + country_code);
    alert("Country Name: " + country);
    alert("IP: " + ip); 
    alert("Time Zone: " + time_zone);
    alert("Latitude: " + latitude);
    alert("Longitude: " + longitude);   
});

$.get("http://freegeoip.net/json/", function (response) {
    $("#ip").html("IP: " + response.ip);
    $("#address").html("Location: " + response.city + ", " + response.region_name);
    $("#details").html(JSON.stringify(response, null, 4));
}, "jsonp");
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<h3>Client side IP geolocation using <a href="http://freegeoip.net">freegeoip.net</a></h3>

<hr/>
<div id="ip"></div>
<div id="address"></div>
<hr/>Full response: <pre id="details"></pre>

评论

0赞 Thiago A. Klein 1/19/2016
在 https 下工作,其他替代方案(如 ipinfo.io)是付费的。谢谢!
1赞 Andrey E 8/7/2017 #6

这可以通过 https://ip-api.io 地理位置 API 实现。它提供国家、城市、邮政编码、坐标、网络、ASN、时区。例如,使用 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
  }
}
9赞 Jonathan 11/6/2017 #7

我创建了 ipdata.co API 来提供可靠的解决方案,请参阅下面的小提琴。它返回许多有用的数据点,例如 - 位置:国家(名称和代码)、地区、城市等、电子商务 - currency_code、货币符号、时区、移动运营商数据,并检测 IP 地址是代理还是 Tor 用户。

Ipdata 有 10 个全局端点,每个端点每秒能够处理 >10,000 个请求。

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

$.get("https://api.ipdata.co?api-key=test", function (response) {
    $("#ip").html("IP: " + response.ip);
    $("#city").html(response.city + ", " + response.region);
    $("#response").html(JSON.stringify(response, null, 4));
}, "jsonp");
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h1><a href="https://ipdata.co">ipdata.co</a> - IP geolocation API</h1>

<div id="ip"></div>
<div id="city"></div>
<pre id="response"></pre>

https://jsfiddle.net/ipdata/6wtf0q4g/922/ 观看小提琴

评论

1赞 A. Meshu 5/22/2018
很好!谢谢
0赞 KTM 7/13/2020
此 API 是否会在附近功能中停止?你有什么计划来阻止这种情况吗?我可以在我的网站上长期使用这个 API 吗?
0赞 Jonathan 7/13/2020
@KTM我们已经存在了 3 年,正常运行时间很长,请看 status.ipdata.co