web-dev-qa-db-fra.com

Comment localiser le visiteur (pays) en utilisant la géolocalisation?

J'essaie d'étendre la fonction de géolocalisation native

if(navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(function(position) {
        var latitude = position.coords.latitude;
        var longitude = position.coords.longitude;
    });
}

afin que je puisse utiliser le nom du pays du visiteur (peut-être renvoyer un tableau informatif).

Jusqu'à présent, tout ce que j'ai pu trouver, ce sont des fonctions qui affichent une interface Google Maps, mais aucune ne m'a réellement donné ce que je veux, sauf pour cette bibliothèque qui a bien fonctionné dans cet exemple mais pour une raison quelconque ne fonctionnait pas sur mon ordinateur. Je ne sais pas pourquoi cela s'est mal passé là-bas.

Quoi qu'il en soit, savez-vous comment je peux simplement renvoyer un tableau contenant des informations telles que le pays, la ville, etc. à partir des valeurs de latitude et de longitude?

javascriptgeolocation
81
Gal

Vous n'avez pas besoin de localiser l'utilisateur si vous n'avez besoin que de son pays. Vous pouvez rechercher leur adresse IP dans n'importe quel service IP-to-location (tel que maxmind ). Ce sera précis la plupart du temps.

Si vous avez vraiment besoin de connaître leur emplacement, vous pouvez obtenir leur lat/lng avec cette méthode, puis interrogez le service de géocodage inversé Google ou Yahoo .

31
Galen

Vous pouvez utiliser mon service, http://ipinfo.io , pour cela. Il vous indiquera l'adresse IP du client, le nom d'hôte, les informations de géolocalisation (ville, région, pays, indicatif régional, code postal, etc.) et le propriétaire du réseau. Voici un exemple simple qui enregistre la ville et le pays:

$.get("https://ipinfo.io", function(response) {
    console.log(response.city, response.country);
}, "jsonp");

Voici un exemple plus détaillé de JSFiddle qui affiche également les informations de réponse complètes, afin que vous puissiez voir tous les détails disponibles: http://jsfiddle.net/zK5FN/2/

L'emplacement sera généralement moins précis que les détails de géolocalisation natifs, mais il ne nécessite aucune autorisation de l'utilisateur.

177
Ben Dowling

Vous pouvez utiliser votre adresse IP pour obtenir votre "pays", votre "ville", votre "fournisseur d'accès Internet", etc.
Utilisez simplement l’un des services Web qui vous fournit une simple API, telle que http://ip-api.com , qui vous fournit un service JSON sur http: //ip-api.com/json . Envoyez simplement une demande Ajax (ou Xhr), puis analysez le code JSON pour obtenir les données dont vous avez besoin.

var requestUrl = "http://ip-api.com/json";

$.ajax({
  url: requestUrl,
  type: 'GET',
  success: function(json)
  {
    console.log("My country is: " + json.country);
  },
  error: function(err)
  {
    console.log("Request failed, error= " + err);
  }
});
20
Gil Epshtain

Voir ipdata.co un service que j’ai construit, rapide et fiable, grâce à ses 10 points de terminaison globaux, chacun pouvant traiter plus de 10 000 demandes par seconde!

Cette réponse utilise une clé d'API 'test' très limitée et destinée uniquement à tester quelques appels. Signup pour votre propre clé API gratuite et recevez jusqu'à 1500 requêtes de développement par jour.

Cet extrait renverra les détails de votre actuel ip. Pour rechercher d'autres adresses IP, il suffit simplement d'ajouter l'adresse IP à la https://api.ipdata.co?api-key=test url, par exemple.

https://api.ipdata.co/1.1.1.1?api-key=test

L'API fournit également un is_eu champ indiquant si l'utilisateur se trouve dans un pays de l'UE.

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

Voici le violon https://jsfiddle.net/ipdata/6wtf0q4g/922/

J'ai aussi écrit ceci une analyse détaillée de 8 des meilleures API de géolocalisation IP.

12
Jonathan

Un service très facile à utiliser est fourni par ws.geonames.org. Voici un exemple d'URL:

http://ws.geonames.org/countryCode?lat=43.7534932&lng=28.5743187&type=JSON

Et voici quelques codes (jQuery) que j'ai ajoutés à votre code:

if (navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(function(position) {
        $.getJSON('http://ws.geonames.org/countryCode', {
            lat: position.coords.latitude,
            lng: position.coords.longitude,
            type: 'JSON'
        }, function(result) {
            alert('Country: ' + result.countryName + '\n' + 'Code: ' + result.countryCode);
        });
    });
}​

Essaye le jsfiddle.net ...

9
hippietrail

vous ne pouvez pas obtenir l'emplacement de la ville par ip. ici vous pouvez obtenir le pays avec jQuery:

$.get("http://ip-api.com/json", function(response) {
console.log(response.country);}, "jsonp");
9
anmml

Un service gratuit et facile à utiliser est fourni à l'adresse Webtechriser (cliquez ici pour lire l'article) (appelé wipmania ). Celui-ci est un service [~ # ~] jsonp [~ # ~] et nécessite un javascript simple codant avec [~ # ~] html [~ # ~] . Il peut également être utilisé dans JQuery . J'ai un peu modifié le code pour changer le format de sortie et voici ce que j'ai utilisé et constaté fonctionner: (c'est le code de ma page HTML)

<html>
    <body>
        <p id="loc"></p>


        <script type="text/javascript">
            var a = document.getElementById("loc");

                    function jsonpCallback(data) { 
                    a.innerHTML = "Latitude: " + data.latitude + 
                              "<br/>Longitude: " + data.longitude + 
                              "<br/>Country: " + data.address.country; 
                    }
        </script>
        <script src="http://api.wipmania.com/jsonp?callback=jsonpCallback"
                     type="text/javascript"></script>


    </body>
</html>

VEUILLEZ NOTER: Ce service obtient l'emplacement du visiteur sans que le visiteur choisit de partager ou non son emplacement, contrairement à l’API de géolocalisation HTML 5 (le code que vous avez écrit). Par conséquent, la vie privée est compromise. Donc, vous devriez faire un usage judiciaire de ce service.

3
user5794376

Pour les développeurs à la recherche d'un utilitaire de géolocalisation complet, vous pouvez consulter geolocator.js (je suis l'auteur).

L'exemple ci-dessous va d'abord essayer HTML5 API de géolocalisation pour obtenir les coordonnées exactes. En cas d'échec ou de rejet, la recherche par Geo-IP est effectuée. Une fois qu'il aura obtenu les coordonnées, il procédera à un géocodage inversé en une adresse.

var options = {
    enableHighAccuracy: true,
    timeout: 6000,
    maximumAge: 0,
    desiredAccuracy: 30,
    fallbackToIP: true, // if HTML5 geolocation fails or rejected
    addressLookup: true, // get detailed address information
    timezone: true, 
    map: "my-map" // this will even create a map for you
};

geolocator.locate(options, function (err, location) {
    console.log(err || location);
});

Il prend en charge la géolocalisation (via des recherches HTML5 ou IP), le géocodage, la recherche d'adresses (géocodage inversé), la distance et les durées, les informations de fuseau horaire, etc.

2
Onur Yıldırım

Vous pouvez utiliser ip-api.io pour localiser le visiteur. Il supporte IPv6.

En prime, il permet de vérifier si l'adresse IP est un nœud tor, un proxy public ou un spammeur.

Code JavaScript:

function getIPDetails() {
    var ipAddress = document.getElementById("txtIP").value;

    var xhttp = new XMLHttpRequest();
    xhttp.onreadystatechange = function () {
        if (this.readyState == 4 && this.status == 200) {
            console.log(JSON.parse(xhttp.responseText));
        }
    };
    xhttp.open("GET", "http://ip-api.io/json/" + ipAddress, true);
    xhttp.send();
}

<input type="text" id="txtIP" placeholder="Enter the ip address" />
<button onclick="getIPDetails()">Get IP Details</button>

code jQuery:

$(document).ready(function () {
        $('#btnGetIpDetail').click(function () {
            if ($('#txtIP').val() == '') {
                alert('IP address is reqired');
                return false;
            }
            $.getJSON("http://ip-api.io/json/" + $('#txtIP').val(),
                 function (result) {
                     alert('Country Name: ' + result.country_name)
                     console.log(result);
                 });
        });
    });

<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<div>
    <input type="text" id="txtIP" />
    <button id="btnGetIpDetail">Get Location of IP</button>
</div>
2
Vindhyachal Kumar