Reagieren auf Positionsupdates (HTML)

Artikel
12/12/2015

[ Dieser Artikel richtet sich an Windows 8.x- und Windows Phone 8.x-Entwickler, die Windows-Runtime-Apps schreiben. Wenn Sie für Windows 10 entwickeln, finden Sie weitere Informationen unter neueste Dokumentation]

Dieses Thema erklärt, wie Sie reagieren können, wenn sich der Standort eines Benutzers geändert hat.

Wissenswertes

Technologien

Windows Runtime

Voraussetzungen

Sie sollten mit HTML und JavaScript vertraut sein.

Anweisungen

Schritt 1: Überprüfen, ob Positionsdienste aktiviert sind

Bevor Ihre App auf Positionsdaten zugreifen kann, muss Position auf dem Gerät aktiviert sein. Vergewissern Sie sich in der Einstellungs-App, dass die folgenden Datenschutzeinstellungen für den Standort aktiviert sind:

Position dieses Geräts... ist aktiviert (gilt nicht für Windows 10 Mobile)
Die Einstellung Position der Positionsdienste ist aktiviert.
Ihre App hat unter Diese Apps dürfen meinen Standort verwenden die Einstellung Ein.

Schritt 2: Öffnen von Microsoft Visual Studio

Erstellen Sie ein neues Projekt, und wählen Sie aus den Projekttypen unter JavaScript/Store-Apps den Typ Leere App aus.

Schritt 3: Erstellen eines neuen Projekts

Wählen Sie im Dialogfeld Neues Projekt in den JavaScript-Projekttypen die Option für eine leere App aus.

Schritt 4: Aktivieren der Positionsfunktion

Doppelklicken Sie im Projektmappen-Explorer sowohl für das Windows- als auch für das Windows Phone-Projekt auf package.appxmanifest, und wählen Sie die Registerkarte Funktionen aus. Aktivieren Sie dann in der Liste Funktionen die Option Position. Dadurch wird der Paketmanifestdatei die Gerätefunktion Location hinzugefügt.

  <Capabilities>
    <!-- DeviceCapability elements must follow Capability elements (if present) -->
    <DeviceCapability Name="location"/>
  </Capabilities>

Schritt 5: Ersetzen des JavaScript-Codes

Öffnen Sie im Projekt "Shared" die Datei "default.js" (/js/default.js). Ersetzen Sie den Code in der Datei durch den folgenden.



(function () {
    "use strict";

    var app = WinJS.Application;
    var activation = Windows.ApplicationModel.Activation;

    app.onactivated = function (args) {
        if (args.detail.kind === activation.ActivationKind.launch) {

            args.setPromise(WinJS.UI.processAll().
                done(function () {

                    // Add an event handler to the button.
                    document.querySelector("#startTracking").addEventListener("click",
                        trackloc);

                    // Add an event handler to the button.
                    document.querySelector("#stopTracking").addEventListener("click",
                        stoptracking);

                }));
        }
    };

    var loc = null;

    function trackloc() {
        if (loc == null) {
            loc = new Windows.Devices.Geolocation.Geolocator();
        }
        if (loc != null) {
            loc.addEventListener("positionchanged", onPositionChanged);
            loc.addEventListener("statuschanged", onStatusChanged);
            // display initial status, in case location is turned off.
            document.getElementById('geolocatorStatus').innerHTML =
                getStatusString(loc.locationStatus);
        }
    }

    function stoptracking() {
        if (loc != null) {
            loc.removeEventListener("positionchanged", onPositionChanged);
        }
    }

    function onPositionChanged(args) {
        var pos = args.position;
        document.getElementById('latitude').innerHTML =
            pos.coordinate.point.position.latitude;
        document.getElementById('longitude').innerHTML =
            pos.coordinate.point.position.longitude;
        document.getElementById('accuracy').innerHTML =
            pos.coordinate.accuracy;
        document.getElementById('geolocatorStatus').innerHTML =
                getStatusString(loc.locationStatus);
    }

    // Handle change in status to display an appropriate message.        
    function onStatusChanged(args) {
        var newStatus = args.status;
        document.getElementById('geolocatorStatus').innerHTML =
            getStatusString(newStatus);
    }

    function getStatusString(locStatus) {
        switch (locStatus) {
            case Windows.Devices.Geolocation.PositionStatus.ready:
                // Location data is available
                return "Location is available.";
                break;
            case Windows.Devices.Geolocation.PositionStatus.initializing:
                // This status indicates that a GPS is still acquiring a fix
                return "A GPS device is still initializing.";
                break;
            case Windows.Devices.Geolocation.PositionStatus.noData:
                // No location data is currently available
                return "Data from location services is currently unavailable.";
                break;
            case Windows.Devices.Geolocation.PositionStatus.disabled:
                // The app doesn't have permission to access location,
                // either because location has been turned off.
                return "Your location is currently turned off. " +
                    "Change your settings through the Settings charm " +
                    " to turn it back on.";
                break;
            case Windows.Devices.Geolocation.PositionStatus.notInitialized:
                // This status indicates that the app has not yet requested
                // location data by calling GetGeolocationAsync() or
                // registering an event handler for the positionChanged event.
                return "Location status is not initialized because " +
                    "the app has not requested location data.";
            case Windows.Devices.Geolocation.PositionStatus.notAvailable:
                // Location is not available on this version of Windows
                return "You do not have the required location services " +
                    "present on your system.";
                break;
            default:
                return "Unknown status.";
        }
    }

    app.start();
})();

Schritt 6: Hinzufügen des HTML-Codes für die Apps

Öffnen Sie die Datei default.html für die Windows- und Windows Phone-Projekte, und kopieren Sie den folgenden HTML-Code zwischen die "BODY"-Tags der Datei.

    <p>Geolocation Event Sample</p><br />
    <span id="status"></span><br />
    <button id="startTracking">Track Location</button><br />
    <br />
    <button id="stopTracking">Stop Tracking</button><br />
    Latitude: <span id="latitude">Waiting for update...</span><br />
    Longitude:  <span id="longitude">Waiting for update...</span><br />
    Accuracy (in meters): <span id="accuracy">Waiting for update...</span><br />
    Location Status: <span id="geolocatorStatus"></span><br />

Schritt 7: Erstellen der App

Klicken Sie auf Erstellen > Projektmappe erstellen, um das Projekt zu erstellen.

Schritt 8: Testen der App

Klicken Sie im Menü Debuggen auf Debugging starten, um die Projektmappe zu testen.
Wenn Sie das Beispiel zum ersten Mal ausführen, werden Sie gefragt, ob die App Ihre Position verwenden kann. Wählen Sie die Option Zulassen aus.
Klicken Sie auf die Schaltfläche Get Location, um die aktuelle Position abzurufen.

Anmerkungen

Positionsdienste nutzen zur Positionsbestimmung eine Reihe unterschiedlicher Quellen. Wenn GPS, Mobilfunkmasten und WLAN nicht verfügbar sind, wird stattdessen die IP-Adresse verwendet. In diesem Fall empfangen Sie möglicherweise keine Positionsupdateereignisse, da IP-Adressdaten nur gelegentlich aktualisiert werden.

Wenn die Anwendung Positionsinformationen nur einmal abrufen muss und kein Updateabonnement erforderlich ist, dann verwenden Sie die GetGeopositionAsync-Methode unter Schnellstart: Feststellen des Benutzerstandorts.