Find user location using jQuery/JS (without google

2020-01-30 03:29发布

站内问答 / JavaScript
727 7 5

Is there a way to find a clients location on a website using just jQuery. For example, if a user comes to my site, how could I find out what their approximate location is just using jQuery. For example, if a user came from San Francisco CA it would have some type identifier to let me know the user came from San Francisco CA. I wouldn't really need their exact location just the county or general area of origin.

edit: How is the information on http://flourishworks-webutils.appspot.com/req generated?

Thanks

7条回答
Rolldiameter
2楼-- · 2020-01-30 03:37 
**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>
查看更多
0人赞 添加讨论(0) 举报
甜甜的少女心
3楼-- · 2020-01-30 03:41

You can use a web service that supports JSONP, such as my service http://ipinfo.io. It'll provide you with the client's IP address, hostname, geolocation information and network owner. Here's an example of it in action with jQuery:

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

Here's a more detailed JSFiddle example that also prints out the full response information, so you can see all of the available details: http://jsfiddle.net/zK5FN/2/

查看更多
0人赞 添加讨论(0) 举报
Juvenile、少年°
4楼-- · 2020-01-30 03:52

The HTML5 Geolocation API allows you to get a user's Latitude/Longitude with some JavaScript (if the browser is compatible, and if the user allows access to his/her location).

You can then reverse-geocode the location to get an address, there are several free reverse-geocoding services other than Google's API.

However, if you don't need accurate location, and if you want all your users to take advantage of the feature (no matter the browser), and if you don't want to ask them whether they allow your site to have their location, I would recommend to use your user's IP to get the location.

查看更多
0人赞 添加讨论(0) 举报
beautiful°
5楼-- · 2020-01-30 03:57

This is possible with https://ip-api.io geo location API. It provides country, city, zip code, coordinates, network, ASN, timezone. For example with jQuery:

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

Also https://ip-api.io checks TOR, public proxy and spammer databases and provides this information as well.

Example response:

{
  "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
  }
}
查看更多
0人赞 添加讨论(0) 举报
做个烂人
6楼-- · 2020-01-30 03:59

I created the ipdata.co API to provide a solid solution to this, see the below fiddle to play with. It returns numerous useful datapoints, such as - location: country (name and code), region, city etc., ecommerce - currency_code, currency symbol, timezone, mobile carrier data and it detects whether the IP address is a Proxy or a Tor user.

Ipdata has 10 global endpoints each able to handle >10,000 requests per second.

This answer uses a 'test' API Key that is very limited and only meant for testing a few calls. Signup for your own Free API Key and get up to 1500 requests daily for development.

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

See the fiddle at https://jsfiddle.net/ipdata/6wtf0q4g/922/

查看更多
0人赞 添加讨论(0) 举报
我欲成王，谁敢阻挡
7楼-- · 2020-01-30 04:01

To get the client IP address & country name in jQuery:

$.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人赞 添加讨论(0) 举报
1 2 下一页
登录 后发表回答
相关问题
查看全部
相关文章
查看全部
收藏的人(5)