HTML Code GeoLocating

Sempervivum

Versuchen wir es mit einigen Logausgaben:

Code

    <div id="log" style="color: white;"></div>
    <script>
        // hier die Sensoren wie bisher

        const thelog = document.getElementById('log');
        function updateSpeed() {
            thelog.innerHTML += 'start geoloc<br>';
            if (navigator.geolocation) {
                thelog.innerHTML += 'geoloc avail<br>';
                navigator.geolocation.getCurrentPosition((position) => {
                    thelog.innerHTML += 'speed=' + position.coords.speed + '<br>';
                    // console.log(position, position.coords.latitude, position.coords.longitude, position.coords.speed);
                    console.log(position.coords.latitude, position.coords.longitude);
                    // document.querySelector("#getlat").textContent = position.coords.latitude;
                    // document.querySelector("#getlng").textContent = position.coords.longitude;
                    document.querySelector("#getspeed").textContent = position.coords.speed * 3.6
                });
            } else {
                thelog.innerHTML += 'geoloc not avail<br>';
            }
        }
        updateSpeed();
        setInterval(updateSpeed, 1000);
    </script>

Alles anzeigen

Dann siehst Du unterhalb der Tabelle was passiert.

stefanbla80

Also da kommt jede Sekunde ein Eintrag dazu

html-seminar.de/woltlab/attachment/2581/

Sempervivum

Das sieht ja schon mal ganz gut aus. Fragt sich, warum keine Geschwindigkeit erkannt wird.

Ich sehe da bei caniuse, dass das nur auf sicheren Servern funktioniert:

https://caniuse.com/#feat=geolocation

Allerdings auf meinem localhost, nicht sicher, funktioniert es mit Opera. Und die Logausgabe sagt, dass Geolocation verfügbar ist.

Ich halte es zwar für unwahrscheinlich, dass dein Handy keine Pfeilfunktionen unterstützt aber sicherheitshalber sollten wir auf die althergebrachte Methode umstellen:

Code

    <script>
        // hier die Sensoren wie bisher
        const thelog = document.getElementById('log');
        function updateSpeed() {
            thelog.innerHTML += 'start geoloc<br>';
            if (navigator.geolocation) {
                thelog.innerHTML += 'geoloc avail<br>';
                navigator.geolocation.getCurrentPosition(function (position) { // <-- hier
                    thelog.innerHTML += 'speed=' + position.coords.speed + '<br>';
                    // console.log(position, position.coords.latitude, position.coords.longitude, position.coords.speed);
                    console.log(position.coords.latitude, position.coords.longitude);
                    // document.querySelector("#getlat").textContent = position.coords.latitude;
                    // document.querySelector("#getlng").textContent = position.coords.longitude;
                    document.querySelector("#getspeed").textContent = position.coords.speed * 3.6
                });
            } else {
                thelog.innerHTML += 'geoloc not avail<br>';
            }
        }
        updateSpeed();
        setInterval(updateSpeed, 1000);
    </script>

Alles anzeigen

Sempervivum

PS: Selfhtml sagt, dass localhost als sicherer Kontext gilt:

"Als sichere Kontexte zählen u. a. HTTPS, lokale Dateien (file:///) sowie der lokale Rechner http://localhost,"

Daher funktioniert es also bei mir lokal.

Dann haben wir u. U. schlechte Karten.

stefanbla80

Mmmh, keine Änderung.
Ich nutze Safari von Apple ...

Code

// hier die Sensoren wie bisher
        const thelog = document.getElementById('log');
        function updateSpeed() {
            thelog.innerHTML += 'start geoloc<br>';
            if (navigator.geolocation) {
                thelog.innerHTML += 'geoloc avail<br>';
        document.querySelector("#getspeed").textContent = 0.0
        document.querySelector("#getlat").textContent = 0.0
                navigator.geolocation.getCurrentPosition(function (position) { // <-- hier
                    thelog.innerHTML += 'speed=' + position.coords.speed + '<br>';
                    // console.log(position, position.coords.latitude, position.coords.longitude, position.coords.speed);
                    // console.log(position.coords.latitude, position.coords.longitude);
            console.log(position.coords.latitude, position.coords.speed);
                    document.querySelector("#getlat").textContent = position.coords.latitude;
                    // document.querySelector("#getlng").textContent = position.coords.longitude;
                    document.querySelector("#getspeed").textContent = position.coords.speed * 3.6
                });
            } else {
                thelog.innerHTML += 'geoloc not avail<br>';
            }
        }
        updateSpeed();
        setInterval(updateSpeed, 1000);

Alles anzeigen

Setze noch die Werte auf Null

html-seminar.de/woltlab/attachment/2582/

stefanbla80

Also sieht es dann unmöglich aus?!

Sempervivum

Nicht unbedingt, scheint keine unlösbare Aufgabe zu sein, auf dem Raspi ein Zertifikat zu installieren:

https://tutorials-raspberrypi.de/raspberry-pi-s…rypt-erstellen/

stefanbla80

ich habe noch das hier gefunden

https://blog.miguelgrinberg.com/post/running-y…tion-over-https

Aber: Bevor ich den Raspi noch heute „zerstöre“ warte ich bis nach meinem Urlaub.

Den Raspi würde ich gerne mit den Temperatursensoren funktionsfähig mitnehmen...

Falls dir noch was einfällt sehr sehr gerne, ich danke vielmals für Deine Geduld und Einsatz

Sempervivum

Gern geschehen, ich bin kein Raspi-Spezialist, mit den Quellen wirst Du nach dem Urlaub sicher zum Ziel kommen.

Jetzt mitmachen!