HTML 5 - Invitation à la géolocalisation dans Chrome

Question

Je commence tout juste à me familiariser avec HTML 5 et je teste la géolocalisation... j'aime bien jusqu'à présent. Je rencontre cependant un petit problème... lorsque j'essaie d'obtenir ma position géographique, Chrome bloque automatiquement la page. Cela ne se produit pas sur d'autres sites, comme le site ci-dessous :

http://html5demos.com/geo

Les scripts que j'utilise :

<script type="text/javascript" JavaScript" SRC="geo.js"></script>   
<script type="text/javascript" JavaScript" SRC="Utility.js"></script> 
<script type="text/javascript" JavaScript" SRC="jquery.js"></script> 
<script type="text/javascript" JavaScript" SRC="modernizr.js"></script>  

function get_location() {

        if (geo_position_js.init()) {
            geo_position_js.getCurrentPosition(show_map, handle_error);
        }

    }
    function show_map(position) {
        var latitude = position.coords.latitude;
        var longitude = position.coords.longitude;

        alert("lat:" + latitude + " long:" + longitude);

    }
    function handle_error(err) {
        alert(err.code);
        if (err.code == 1) {
            // user said no!
        }
    }

    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(show_map, handle_error);
    } else {
        error('not supported');
    }

Je fais ce test à partir d'un répertoire local sur mon ordinateur, il n'y a donc pas vraiment de "domaine" comme "http://whatever.com/mytestpage.html". Est-ce la raison pour laquelle je ne reçois pas d'invite ? Dans l'affirmative, est-il possible de forcer le navigateur à demander la permission d'obtenir l'emplacement géographique de l'utilisateur et est-ce possible dans mon scénario ?

Answer 1

Il y a une sorte de restriction de sécurité en place dans Chrome pour l'utilisation de la géolocalisation d'une file:/// URI, mais malheureusement il ne semble pas enregistrer d'erreurs pour l'indiquer. Il fonctionnera à partir d'un serveur web local. Si vous avez installé python, essayez d'ouvrir une invite de commande dans le répertoire où se trouvent vos fichiers de test et lancez la commande :

python -m SimpleHTTPServer

Il devrait démarrer un serveur web sur le port 8000 (il se peut que ce soit autre chose, mais la console vous dira sur quel port il écoute), puis naviguer vers http://localhost:8000/mytestpage.html

Si vous ne disposez pas de python, il existe des modules équivalents en Ruby, ou Visual Web Developer Express est livré avec un serveur web local intégré.

Answer 2

Aucun des éléments ci-dessus ne m'a aidé.

Après quelques recherches, j'ai découvert qu'à partir de M50 (avril 2016) - Chrome exige désormais une origine sécurisée (telle que HTTPS) pour la géolocalisation. .

Fonctionnalités obsolètes aux origines peu sûres

L'hôte "localhost" est spécial parce qu'il est "potentiellement sécurisé". Vous ne verrez peut-être pas d'erreurs pendant le développement si vous déployez sur votre machine de développement.

Answer 3

Comme déjà mentionné dans la réponse de robertc, Chrome bloque certaines fonctionnalités, comme la géolocalisation avec les fichiers locaux. Une alternative plus simple à la mise en place d'un serveur web propre serait de simplement démarrer Chrome avec le paramètre --allow-file-access-from-files . Vous pouvez alors utiliser la géolocalisation, à condition de ne pas l'avoir désactivée dans vos paramètres.

Answer 4

Le plus simple est de cliquer sur la zone située à gauche de la barre d'adresse et d'y modifier les paramètres de localisation. Il est possible de définir des options de localisation même pour file:///

Answer 5

Si vous hébergez derrière un serveur, et que vous rencontrez toujours des problèmes : essayez de changer localhost à 127.0.0.1 par exemple http://localhost:8080/ à http://127.0.0.1:8080/

Le problème auquel je faisais face était que je servais un site utilisant apache tomcat dans un IDE eclipse (eclipse luna).

Pour vérifier ma santé mentale, j'ai utilisé la démo de Remy Sharp : https://github.com/remy/html5demos/blob/eae156ca2e35efbc648c381222fac20d821df494/demos/geo.html

et j'obtenais l'erreur après avoir apporté des modifications mineures à la fonction d'erreur malgré l'hébergement du code sur le serveur (cela ne fonctionnait que sur firefox et échouait sur chrome et safari) :

"Géolocalisation refusée par l'utilisateur"

J'ai fait la modification suivante pour obtenir un message d'erreur plus détaillé :

function error(msg) {
  var s = document.querySelector('#status');
  msg = msg.message ? msg.message : msg; //add this line
  s.innerHTML = typeof msg == 'string' ? msg : "failed";
  s.className = 'fail';

  // console.log(arguments);
}

échec sur internet explorer derrière virtualbox IE10 sur http://10.0.2.2:8080 :

"L'emplacement actuel ne peut être déterminé"