--- title: "Die Integration von APIs und mobilen Anwendungen" date: "2018-08-21" categories: - "json" - "mobile-development" - "mobiletogether" - "xml" tags: - "apis-and-mobile-apps" - "data-integration" - "mobile-development" description: Erfahren Sie, wie Sie APIs effektiv in mobile Anwendungen integrieren können, um die Benutzererfahrung zu verbessern. Dieser Leitfaden behandelt Funktionen zur Standortbestimmung, RESTful-Anfragen und die Verarbeitung von Daten. --- Status: #blog Tags: #apis-and-mobile-apps #data-integration #mobile-development Categories: [json](/blog/de/category/json.md) | [mobile-development](/blog/de/category/mobile-development.md) | [mobile-development](/blog/de/category/mobile-development.md) | [xml](/blog/de/category/xml.md) # Die Integration von APIs und mobilen Anwendungen Mobile Nutzer, die viel unterwegs sind, bevorzugen Apps, die benutzerfreundlich und effizient sind. MobileTogether bietet Entwicklern Funktionen, um APIs und mobile Anwendungen nahtlos zu integrieren und so die Funktionalität mobiler Geräte mit aktuellen Informationen aus externen Quellen zu kombinieren. Dies ermöglicht es Entwicklern, individuelle, plattformübergreifende native Apps zu erstellen, die eine hochwertige und unterhaltsame Benutzererfahrung bieten. Öffentliche APIs sind eine hervorragende Quelle für externe Daten, die fast jede individuelle mobile App verbessern können. Entwickler können Informationen aus verschiedenen APIs kombinieren, um Nutzern bessere Informationen schneller und in einer eleganten, integrierten Form bereitzustellen. Für fast jede Art von Informationen, die Ihre mobile App möglicherweise benötigt, stehen APIs zur Verfügung, von der Flugverfolgung über Rohstoff- und Aktienkurse bis hin zur Verfolgung tropischer Stürme. In diesem Artikel werden wir uns eine GPS-App vorstellen, die mit der Standortbestimmung auf mobilen Geräten beginnt, um die grundlegende Frage zu beantworten: "Wo bin ich?". Anschließend stellt sie eine Verbindung zu APIs von Google und MapQuest her, um eine Vielzahl zusätzlicher Informationen hinzuzufügen. Wir werden eine standortbezogene Suchmaschine integrieren, um nahegelegene Sehenswürdigkeiten in einem Umkreis von bis zu 400 Metern zu finden, bis hin zur präzisen Lokalisierung des Nutzers in einem Satellitenbild mit einer Weitwinkelaufnahme eines ganzen Kontinents oder mehr. [![](/blog/images/image01.png)](image01.png) Wenn unsere App gestartet wird, wird der Benutzer zunächst mit Schaltflächen zur Steuerung des GPS-Systems konfrontiert, wie man in diesem Screenshot aus dem Fenster des MobileTogether-Simulators sehen kann: [![Anfangsseite einer mobilen App, die Daten von einer API abruft](/blog/images/api-data-and-mobile-apps-initial-user-screen.png)](api-data-and-mobile-apps-initial-user-screen.png) Sobald der erste Koordinatenpunkt erfasst wurde, bieten eine Reihe von farbigen Symbolen in der Symbolleiste Zugriff auf neue Optionen: [![Mobile Anwendungen: Werkzeuge, die nach der Erfassung der geografischen Koordinaten verwendet werden](/blog/images/api-data-and-mobile-apps-coordinates-captured.png)](api-data-and-mobile-apps-coordinates-captured.png) Von links nach rechts übernehmen die Tasten folgende Funktionen: - Der grüne Dialog-Button öffnet die Textnachrichten-App des mobilen Geräts und sendet eine vordefinierte Nachricht, die lautet: „Ich bin hier:“, gefolgt von den Längen- und Breitengrad-Koordinaten sowie der Straßenadresse. Diese Schaltfläche kombiniert eine MobileTogether-SMS-Aktion mit Textdaten aus der Geolocation-Quelle, wie im folgenden Aktionsbaum dargestellt. Diese Funktion funktioniert auf Android-, iPhone- oder Windows-Telefonen, und der Entwickler muss sich keine Gedanken über die spezifischen Mechanismen zur Steuerung des Betriebssystems jedes Mobiltelefons machen. MobileTogether kümmert sich automatisch um die Details für jedes Gerät. [![Senden einer Textnachricht mit den erfassten Geodaten](/blog/images/api-data-and-mobile-apps-share-by-sms.png)](api-data-and-mobile-apps-share-by-sms.png) - Das Symbol für die gefaltete Karte öffnet die standardmäßige Kartenanwendung des mobilen Geräts und zentriert diese auf den angezeigten Koordinaten. Dies ist auch eine MobileTogether-Funktion, wobei die Details für die Anbindung an die verschiedenen Gerätetypen automatisch verwaltet werden: [![Die gleiche MobileTogether-Funktion zeigt eine Karte des aktuellen Standorts für jedes mobile Betriebssystem an](/blog/images/api-data-and-mobile-apps-show-map-action.png)](api-data-and-mobile-apps-show-map-action.png) - Das Symbol mit den drei Punkten ist ein Button für "Weitere Informationen". Dieser führt eine Reihe von Aktionen aus. Zunächst werden die Koordinaten für Breitengrad und Längengrad an eine MapQuest Reverse-Geocoding-API gesendet, um eine Straßenadresse zu erhalten, die oft vollständiger ist als die reine Geolocation-Adresse. Anschließend wird eine MobileTogether-Aktion verwendet, um den Webbrowser des mobilen Geräts zu öffnen und eine Suchanfrage basierend auf der Adresse zu starten: [![MobileTogether-Aktionen ermöglichen das dynamische Erstellen einer URL](/blog/images/api-data-and-mobile-apps-build-a-url.png)](api-data-and-mobile-apps-build-a-url.png) - Das Symbol für das Satellitenbild-Tool kommuniziert mit der Google Maps API, um eine Satellitenbilddatei des Standorts zu erstellen, wobei der vom Benutzer angegebene Zoomgrad verwendet wird. Das Bild kann in der Foto-Bibliothek des mobilen Geräts gespeichert oder per SMS-Nachricht oder E-Mail versendet werden. Hier ist ein Beispiel für die oben genannten Koordinaten: [![MobileTogether-Aktion zum Erstellen einer URL für das Satellitenbild](/blog/images/api-data-and-mobile-apps-satellite-image-url.png)](api-data-and-mobile-apps-satellite-image-url.png) [![Satellitenbild, wie es von der MobileTogether-App generiert wurde](/blog/images/api-data-and-mobile-apps-satellite-image-1.jpg)](api-data-and-mobile-apps-satellite-image-1.jpg) - Das Lupen-Werkzeug öffnet eine neue Seite und nutzt die Such- und Ortsfindungs-APIs von MapQuest, um dem Benutzer zwei verschiedene Suchoptionen anzubieten. ### Die Verbindung zwischen APIs und mobilen Anwendungen herstellen Das Werkzeug zur Verarbeitung von Satellitenbildern verwendet einen XPath-Ausdruck, um mithilfe der Google Maps API ein Bild zu generieren und es über eine URL zu öffnen. Die für die API erforderlichen Parameter werden als Teil der URL übergeben, um verschiedene Optionen festzulegen. Die Werte für jeden Parameter werden dabei dynamisch generiert. Hier ist der XPath-Ausdruck, wie er im XPath/XQuery-Ausdrucks-Editor angezeigt wird: [![Erstellen einer URL für eine API im XPath/XQuery-Ausdrucks-Editor von MobileTogether](/blog/images/api-data-and-mobile-apps-building-an-api-url.png)](api-data-and-mobile-apps-building-an-api-url.png) Die farbliche Kennzeichnung hilft, die Bedeutung zu verdeutlichen: Der grüne Begriff in Zeile 1 ist ein String-Operator, die orangefarbenen Begriffe in einfachen Anführungszeichen sind Konstanten, und die violette Farbe steht für Elemente aus dem Datenbaum oder für Funktionsergebnisse. Und hier ist ein Beispiel für die endgültige URL, formatiert mit Zeilenumbrüchen, um der XPath-Ausdrucksstruktur zu entsprechen: [![URL, die in der MobileTogether-App generiert werden](/blog/images/api-data-and-mobile-apps-url-example.png)](api-data-and-mobile-apps-url-example.png) Die erzeugte Bildgröße wird automatisch an die Fensterbreite und -höhe jedes Endgeräte angepasst, da diese Werte als globale Variablen in MobileTogether definiert sind. Die Funktion, die dem Satellitentaste zugewiesen ist, öffnet die angegebene URL im Standard-Webbrowser des mobilen Geräts. ### MobileTogether unterstützt HTTP/FTP-, REST- und SOAP-Anfragen, um APIs und mobile Anwendungen zu integrieren Die MapQuest-Suchfunktion und die Place-Search-API verwenden jeweils eine REST-basierte API-Abfrage, um strukturierte Daten abzurufen. Diese Daten werden als Quelle in der Datenstruktur von MobileTogether gespeichert und stehen für weitere Verarbeitung zur Verfügung. Die GET-Anfrage wird in einem Dialog definiert, der erstellt wird, wenn die Seitendatei zum Datenbaum der App hinzugefügt wird, wie hier gezeigt: [![MobileTogether unterstützt REST-Anfragen, um Daten über eine API abzurufen](/blog/images/api-data-and-mobile-apps-REST-call.png)](api-data-and-mobile-apps-REST-call.png) Eine einfache Möglichkeit, die Anfrage zu erstellen, besteht darin, eine Beispiel-URL aus der API-Dokumentation in das URL-Feld oben einzufügen und dann die Parameterdefinitionen innerhalb der geschweiften Klammern { } zu ersetzen. Definieren Sie anschließend die Quellen für die Werte in den Parametern im entsprechenden Abschnitt. Die Suchfunktion mit Kategorien in unserer App ermöglicht es dem Benutzer, den Suchradius und die maximale Anzahl der Ergebnisse über Dropdown-Menüs festzulegen. Zusätzliche Dropdown-Menüs ermöglichen es dem Benutzer, das Suchziel aus einer Liste auszuwählen, die in der API-Dokumentation bereitgestellt wird. Wenn der Benutzer auf die Schaltfläche "Suchen" klickt, führt eine MobileTogether-Aktion eine GET-Anfrage aus: [![Die MobileTogether-App verfügt über eine Benutzer-Taste, mit der externe Daten über eine API abgerufen werden können](/blog/images/api-data-and-mobile-apps-get-request.png)](api-data-and-mobile-apps-get-request.png) [![MobileTogether-Aktion zum Ausführen einer API-GET-Anfrage](/blog/images/api-data-and-mobile-apps-get-request-action.png)](api-data-and-mobile-apps-get-request-action.png) Die zurückgegebenen XML-Daten werden dem Datenbaum hinzugefügt, wie hier im Bereich "Quellcode der Seite" des Fensters des MobileTogether-Simulators zu sehen ist: [![Externe Daten, die von MobileTogether über den API-Aufruf abgerufen werden](/blog/images/api-data-and-mobile-apps-external-data-retrieved.png)](api-data-and-mobile-apps-external-data-retrieved.png) Eine neue Suchergebnisseite wird geöffnet, um dem Benutzer Informationen in Form einer scrollbaren Tabelle anzuzeigen. Bitte beachten Sie, dass die API die Ergebnisse automatisch nach Radius von der aktuellen Position sortiert hat. [![Die Darstellung der abgerufenen Daten für den Benutzer in der MobileTogether-App](/blog/images/api-data-and-mobile-apps-user-data-view.png)](api-data-and-mobile-apps-user-data-view.png) Zusätzliche Symbolleisten auf der Seite mit den Suchergebnissen öffnen eine Karte mit der Route zum Zielort, starten eine Websuche nach dem Namen und Standort des Ziels oder ermöglichen einen Anruf beim Zielort mit nur einem Klick. Die Kategorie-Suche liefert gute Ergebnisse, kann aber für den Benutzer umständlich sein, wenn er aus mehr als 300 möglichen Suchergebnissen auswählen muss. Die MapQuest Place Search API akzeptiert jede beliebige Textphrase als Suchbegriff und liefert ähnliche Ergebnisse. Die Place Search API wird ebenfalls als RESTful-GET-Anfrage aufgerufen und ist ähnlich der Kategorie-Suche aufgebaut: [![MobileTogether-Konfiguration für eine zweite REST-Anfrage, um zusätzliche Daten abzurufen](/blog/images/api-data-and-mobile-apps-REST-call-2.png)](api-data-and-mobile-apps-REST-call-2.png) Es gibt mehrere Unterschiede bei den erforderlichen Parametern und den von der Place Search API zurückgegebenen Daten. Die Kategorie-Suche bietet Ergebnisse im XML- oder JSON-Format, während die Place Search API ausschließlich JSON-Daten zurückgibt. Die Kombination verschiedener Datenformate ist für MobileTogether kein Problem. Wir haben einfach ein Eingabefeld in unserer App erstellt, um Benutzereingaben zu erfassen, und wir haben erneut eine "Neu laden"-Aktion verwendet, um die GET-Anfrage auszuführen. [![Die MobileTogether-App sammelt Benutzereingaben, um eine API-Anfrage im REST-Format zu erstellen](/blog/images/api-data-and-mobile-apps-user-tool-2.png)](api-data-and-mobile-apps-user-tool-2.png) Die JSON-Ergebnisse werden hier im Datenbaum "Quellcode der Seite" im Simulationsfenster angezeigt: [![Anzeige der JSON-Daten, die von der MobileTogether-App abgerufen wurden](/blog/images/api-data-and-mobile-apps-JSON-data-view.png)](api-data-and-mobile-apps-JSON-data-view.png) Die Ergebnisse werden dem Benutzer in einer scrollbaren Tabelle angezeigt, wie hier in einer Teilansicht dargestellt. Diese API liefert jedoch keine Informationen über die Entfernung vom aktuellen Standort oder Telefonnummern [![Die Ansicht der externen JSON-Daten in der MobileTogether-App aus Benutzersicht](/blog/images/api-data-and-mobile-apps-user-view-json.png)](api-data-and-mobile-apps-user-view-json.png) Obwohl die API JSON-Daten zurückgegeben hat, können wir die Ergebnisse dennoch für eine MobileTogether-Geolokalisierungsaktion verwenden, sodass beim Anklicken des Kartenbuttons die standardmäßige Kartenanwendung des mobilen Geräts geöffnet wird und die Route zum angegebenen Ziel angezeigt wird [![MobileTogether-Aktion zum Anzeigen der Route zu einem bestimmten Ort](/blog/images/api-data-and-mobile-apps-show-route-action.png)](api-data-and-mobile-apps-show-route-action.png) [![Karte, die durch die oben gezeigte MobileTogether-Funktion erstellt wurde](/blog/images/api-data-and-mobile-apps-show-route-map.png)](api-data-and-mobile-apps-show-route-map.png) Eine MobileTogether-Aktion vom Typ "Open URL" wird dem "Globe"-Tool zugewiesen, um den Namen und die Adresse des Ergebnisstandorts in einem Webbrowser-Fenster anzuzeigen. Die verschachtelten Ersetzungsoperatoren sorgen dafür, dass eine URL mit gültiger Syntax generiert wird. [![MobileTogether-Aktion zum dynamischen Erstellen einer Websuchanfrage](/blog/images/api-data-and-mobile-apps-web-search-action.png)](api-data-and-mobile-apps-web-search-action.png) [![Ansicht der App-Suchanfrage, wie sie auf einem Android-Gerät angezeigt wird](/blog/images/api-data-and-mobile-apps-web-search.png)](api-data-and-mobile-apps-web-search.png) ### Ein Hinweis zu API-Schlüsseln Ein Parameter, der von jeder der hier beschriebenen APIs benötigt wird, ist ein eindeutiger API-Schlüssel, der vom API-Anbieter zugewiesen wird. Dieser API-Schlüssel dient zur Identifizierung und Authentifizierung des Nutzers, wann immer eine API-Anfrage gestellt wird. Für eine Anwendung, die von einer Gruppe definierter Unternehmenskunden gemeinsam genutzt wird, ist es wahrscheinlich am besten, einen einzigen, gemeinsamen Schlüssel zu verwenden, der als persistentes Element im MobileTogether-Datenspeicher gespeichert wird. Anfragen von allen Nutzern werden zusammengefasst, und es wird eine einzige Rechnung erstellt, wenn die Gesamtnutzung eine bestimmte, kostenlose Nutzungsgrenze für eine beliebige API überschreitet. Wenn eine App für die öffentliche Verbreitung bestimmt ist, kann es für den Entwickler sinnvoll sein, von jedem Nutzer die Verwendung eines eindeutigen API-Schlüssels zu verlangen und die Verantwortung für die individuelle Nutzung zu übertragen. Unsere App enthält eine Einstellungsseite, die über das Zahnradsymbol auf der Startseite aufgerufen werden kann. Auf der Einstellungsseite kann der Nutzer verschiedene Benutzereinstellungen konfigurieren, darunter die Auswahl von Suchmaschinen und eine Funktion, mit der jeder API-Schlüssel in einem persistenten Datenspeicher gespeichert wird, der für jedes mobile Gerät eindeutig ist. [![Das Erfassen eines eindeutigen API-Schlüssels für den Benutzer in der MobileTogether-App](/blog/images/api-data-an-mobile-apps-record-key.png)](api-data-an-mobile-apps-record-key.png) ### Zusätzliche Funktionen hinzufügen Bisher haben wir einige gängige Geolocation-Funktionen beschrieben, die in vielen mobilen Anwendungen zu finden sind. Sie können auch die oben genannten APIs – oder andere öffentliche APIs – nutzen, um Funktionen hinzuzufügen, die spezifische Probleme lösen. Beispielsweise enthält unsere App eine Seite mit dem Titel "Wo war ich?". Jeder, der eine Reise entlang einer Route dokumentieren möchte, kann auf dieser Seite das Symbol "Umschlag" anklicken, um eine Reisedokumentation per E-Mail einzusenden. In unserer App öffnet ein langer Klick auf jedes Symbol eine Hilfenachricht in einem Pop-up-Fenster: [![Eine Pop-up-Hilfenachricht, wie sie in der Android-Version einer MobileTogether-App angezeigt wird](/blog/images/api-data-and-mobile-apps-pop-up-help.png)](api-data-and-mobile-apps-pop-up-help.png) Sie können selbst APIs und mobile Anwendungen kombinieren und alle anderen Funktionen von MobileTogether nutzen, um elegante, plattformübergreifende mobile Anwendungen zu entwickeln, indem Sie [den kostenlosen MobileTogether Designer herunterladen](https://www.altova.com/de/download/mobiletogether.html). Dieser wird mit integrierter Hilfe, Tutorials und zahlreichen Beispielen geliefert. Sie können auch viele [Video-Demonstrationen](https://www.altova.com/de/mobiletogether/demos) von MobileTogether ansehen, um den Einstieg zu erleichtern.