【问题标题】:Find user location using jQuery/JS (without google geolocation api)? [duplicate]使用 jQuery/JS 查找用户位置(没有 google geolocation api)? [复制]
【发布时间】:2012-12-20 02:26:48
【问题描述】:

有没有办法仅使用 jQuery 在网站上查找客户位置。例如,如果一个用户访问我的站点,我如何仅使用 jQuery 找出他们的大概位置。例如,如果用户来自旧金山 CA,它将有一些类型标识符让我知道用户来自旧金山 CA。我真的不需要他们的确切位置,只需要县或一般原产地。

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

谢谢

【问题讨论】:

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

标签: javascript jquery unobtrusive-javascript


【解决方案1】:

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

【讨论】:

  • 在 https 下工作,其他替代方案如 ipinfo.io 是付费的。谢谢!
【解决方案2】:

您可以使用支持 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/

【讨论】:

  • 这可行,但如果您每天有超过 1,000 个 API 请求,就会出现问题。如果您需要提出更多请求,则需要付费。
【解决方案3】:

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

然后你可以reverse-geocode这个位置来获取地址,除了谷歌的API之外还有几个free reverse-geocoding服务。

但是,如果您不需要准确的位置,并且如果您希望所有用户都使用该功能(无论浏览器如何),并且如果您不想询问他们是否允许您的网站有他们的位置,我会推荐给use your user's IP to get the location

【讨论】:

    【解决方案4】:

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

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

    此答案使用非常有限的“测试”API 密钥,仅用于测试少数调用。 Signup 获取您自己的免费 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/查看小提琴

    【讨论】:

    • 非常好!谢谢
    • 这个 API 会停止在近距离功能中吗?你有什么计划阻止这一切吗?我可以在我的网站上长期使用这个 API 吗?
    • @KTM 我们已经存在 3 年了,正常运行时间很长,请参阅 status.ipdata.co
    【解决方案5】:
    **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>
    

    【讨论】:

      【解决方案6】:

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

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

      如果有一个脚本在服务器端运行,那么就有一个从客户端到服务器的连接。在这种情况下,服务器必须知道 IP 地址。您可以采取一个技巧来首先获取 IP 地址。

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

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

      【讨论】:

        【解决方案7】:

        这可以通过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
          }
        }
        

        【讨论】:

          猜你喜欢
          • 2014-11-15
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 2013-07-15
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          相关资源
          最近更新 更多