Adobe PhoneGap

Adobe PhoneGap
Basisdaten
Hauptentwickler	Joe Bowser, Michael Brooks, Rob Ellis, Dave Johnson, Anis Kadri, Brian Leroux, Jesse MacFadyen, Filip Maj, Eric Oesterle, Brock Whitten, Herman Wong, Shazron Abdullah
Entwickler	Adobe Inc.
Aktuelle Version	9.0.0 (10. Oktober 2019)
Betriebssystem	iOS, Android, webOS, Symbian OS, Blackberry, Windows Phone, Windows 8
Programmiersprache	JavaScript
Lizenz	Apache-Lizenz 2.0
build.phonegap.com

Adobe PhoneGap (früher PhoneGap) ist ein Framework zur Erstellung hybrider Applikationen für mobile Endgeräte. PhoneGap wurde ursprünglich vom Unternehmen Nitobi entwickelt, das 2011 von Adobe Inc. übernommen wurde. Im August 2020 teilte Adobe mit, die Weiterentwicklung von PhoneGap einzustellen. Der zugehörige Cloud-Build-Dienst PhoneGap Build wird zum 1. Oktober 2020 beendet.

PhoneGap ermöglicht es, Anwendungssoftware für mobile Endgeräte mit JavaScript, HTML5 und CSS3 zu schreiben, anstelle von gerätespezifischen Programmiersprachen wie Swift oder Java. Die dabei entstehenden Applikationen sind hybride Applikationen; sie sind weder native Applikationen, weil das Layout mittels Webtechnologien und nicht mit nativen User Interface Frameworks geschrieben wird, noch sind sie webbasierte Applikationen, da sie als Apps über die Verkaufsportale der Betriebssystemhersteller verteilt werden können und auf die Programmierschnittstellen der Betriebssysteme der Endgeräte zugreifen können. Ab der Version 1.9 ist es sogar möglich, frei native und hybride Codeteile zu mischen.

PhoneGap baut auf Apache Cordova auf, welches von Adobe/Nitobi der Apache Software Foundation gespendet wurde. Apache Cordova hieß ursprünglich ebenfalls PhoneGap, musste aber aus rechtlichen Gründen umbenannt werden, da für Apache-Projekte aus markenrechtlichen Gründen keine bereits belegten Namen verwendet werden dürfen. Es wurde zunächst Apache Callback genannt und später in Apache Cordova umbenannt. Bei Adobe Systems taucht es auch als Adobe PhoneGap und Adobe PhoneGap Build auf.

PhoneGap wurde für die Erstellung vieler mobiler Applikationen verwendet, auf der PhoneGap-Website werden 1.890 in den diversen Online Stores vertriebene gelistet. Apple Inc. hat bestätigt, dass das Framework auch mit den 4.0-Entwickler-Lizenzabkommen kompatibel ist.

PhoneGap wird von verschiedenen mobilen Applikationsplattformen wie ViziApps, Worklight, Convertigo appMobi und AppByYou verwendet. Die JavaScript-Bibliothek Sencha Touch ist ab der Version 2.3 kompatibel mit PhoneGap, wodurch eine vereinfachte Integration von APIs, wie Notifikation, Kontakte, Speicher oder Kamera möglich ist.

Geschichte

Erstmals vorgestellt und weiterentwickelt wurde PhoneGap während eines iPhoneDevCamp Events in San Francisco. Bei der O’Reilly Media 2009 Web 2.0 Conference gewann PhoneGap den People’s Choice Award.

Am 4. Oktober 2011 verkündete Adobe offiziell die Übernahme von Nitobi Software, der ursprünglich hinter der PhoneGap Entwicklung stehenden Firma. Gleichzeitig wurde PhoneGap der Apache Software Foundation gespendet.

Frühe Versionen von PhoneGap benötigten einen Apple-Computer, um iOS-Applikationen, und einen Windows PC, um Windows-Mobile-Applikationen erstellen zu können. Seit September 2012 ermöglicht Adobes PhoneGap Build Service das Hochladen von PhoneGap-Applikationen in Form von HTML-, CSS- und JavaScript-Sourcecode in einen sogenannten „Cloud compiler“, der die Applikationen für alle unterstützten Plattformen generiert.

Vorgehensweise

PhoneGap-Applikationen verwenden HTML5 und CSS3 für die Darstellung und JavaScript für die Programmlogik. Obwohl HTML5 Zugriff auf mobile Technologien wie Beschleunigungssensor, Kamera und GPS ermöglicht, wird HTML5 noch nicht gleichmäßig für alle mobilen Browser, speziell für ältere Androidversionen, angeboten. Um diese Beeinträchtigungen zu vermeiden, bettet das PhoneGap-Framework HTML5-Code in einer nativen WebView mittels Foreign Function Interface ein. Damit können die nativen APIs der Geräte direkt angesprochen werden.

PhoneGap kann auch mit nativen Plug-ins, welche den Entwicklern per JavaScript aufrufbare Funktionalitäten zur Verfügung stellen, erweitert werden. PhoneGap stellt bereits Plug-ins für den Zugriff auf Kontakte und Termine, Benachrichtigungen, Locale des Benutzers, Speicher und Dateien, Device- und Verbindungsinformationen, Splash Screen, In-App-Browser, Beschleunigungssensor, Kamera, Ton-, Bild- und Videoaufnahme und -abspielung, Kompass und GPS zur Verfügung.

Durch die Verwendung der webbasierten Technologien werden PhoneGap-Applikationen unter Umständen langsamer als native Applikationen mit gleichartiger Funktionalität. Adobe Systems warnt davor, dass mit PhoneGap entwickelte Applikationen möglicherweise von Apple, auf Grund ihrer geringen Geschwindigkeit oder weil sie sich nicht „nativ genug“ anfühlen, nicht akzeptiert werden.

Unterstützte Plattformen

PhoneGap unterstützt derzeit die Entwicklung für die Betriebssysteme Apple iOS, Google Android, LG webOS, Microsoft Windows Phone, Blackberry und Tizen (SDK 2.x).

Erweiterungen von PhoneGap für andere Betriebssysteme und Versionen sind geplant oder werden von anderen Herstellern angeboten. Unterstützt wird unter anderem Nokia Symbian OS, Bada.

Die folgende Tabelle zeigt, welche für Mobile Devices typischen Fähigkeiten je Betriebssystem von PhoneGap unterstützt werden:

Fähigkeiten	bis iPhone 3G	ab iPhone 3GS	Android	Windows Phone	BlackBerry 10, PlayBook OS	Black Berry 4.6–4.7	Black Berry 5.x–6.0+	Bada	Symbian	webOS	Tizen
Beschleunigungssensor	Ja	Ja	Ja	Ja	Ja	Nein	Ja	Ja	Ja	Ja	Ja
Kamera	Ja	Ja	Ja	Ja	Ja	Nein	Ja	Ja	Ja	Ja	Ja
Kompass	Nein	Ja	Ja	Ja	Ja	Nein	Nein	Ja	Nein	Ja	Ja
Kontakte	Ja	Ja	Ja	Ja	Ja	Nein	Ja	Ja	Ja	Nein	Ja
Dateien	Ja	Ja	Ja	Ja	Ja	Nein	Ja	Nein	Nein	Nein	Ja
Geolocation	Ja	Ja	Ja	Ja	Ja	Ja	Ja	Ja	Ja	Ja	Ja
Medien	Ja	Ja	Ja	Ja	Ja	Nein	Nein	Nein	Nein	Nein	Ja
Netzwerk	Ja	Ja	Ja	Ja	Ja	Ja	Ja	Ja	Ja	Ja	Ja
Benachrichtigungen (Alarm, Ton, Vibration)	Ja	Ja	Ja	Ja	Ja	Ja	Ja	Ja	Ja	Ja	Ja
Speicher	Ja	Ja	Ja	Ja	Ja	Nein	Ja	Nein	Ja	Ja	Ja

Plugins

Cordova stellt eine Schnittstelle für Plug-ins zur Verfügung. Damit können Funktionen von Betriebssystem abhängige Bibliotheken aufgerufen werden. Die Funktion kann mittels JavaScript aufgerufen werden. Dabei werden Callback-Funktionen, die bei Erfolg und bei Fehlern aufgerufen werden, mitgegeben. Im folgenden Beispiel heißt das Plugin „mein_web_telefon“, die Funktion, die ausgeführt werden soll, lautet „anrufen“. In einem Array können Parameter übergeben werden. Im folgenden Beispiel wird die Telefonnummer, die URL des Telefon-Servers, Benutzer und Passwort übergeben um eine Voice-over-IP-Verbindung herzustellen. Bei Erfolg wird eine Javascript Funktion aufgerufen die die Nachricht „Ich wähle schon wie der Teufel!“ anzeigt. Im Fehlerfall wird die Fehlermeldung angezeigt.

Beispiel eines Aufrufs mittels Javascript:

 cordova.exec(function(Parameter) {alert('Ich wähle schon wie der Teufel!');},
                 function(error) {alert('Fehler: ' + error);},
                 "mein_web_telefon",
                 "anrufen",
                 ["099 111 22 33", "sip://meine_telefonanlage.com", "mein_benutzer", "mein_password"]);

Die Definitionen der Schnittstellen zum eigentlichen Plugin müssen sich in einer Javascript-Datei im Unterverzeichnis „www“ befinden. Oftmals wird als Name „index.js“ gewählt, dies ist aber keine Voraussetzung. Auch mehrere Javascript-Dateien können diese Aufgabe übernehmen.

Das eigentliche Plugin muss für das jeweilige Betriebssystem separat programmiert werden, da es wie im vorgenannten Beispiel ja Socket-Verbindungen zum Telefon-Server herstellen muss. Aufgrund der Limitierungen eines Webbrowsers (Und ein Webview ist ein Webbrowser ohne Benutzer-Interaktion), kann ein Webview keine UDP, TLS- bzw. TCP/IP-Verbindungen zum Telefonserver errichten. Diese Funktionalität muss das Plugin liefern. Und zwar in der jeweiligen Technologie des Betriebssystems. Bei Android wird zumeist ein Plugin in Java geschrieben, da jedes Android Telefon, bzw. jedes Android Pad Java Programme und Bibliotheken ausführen kann. Natürlich könnte man eine WebSocket-Verbindung zum Telefon-Server aufbauen. Im Beispiel wird aber angenommen, dass die Cordova-App Telefonanlagen bedienen soll, die über keine WebRTC Technologie verfügen. Anschließend ein nicht lauffähiges Beispiel um ein Plugin zu veranschaulichen. Das Beispiel verwendet „linphone“ als RTC und SIP-Bibliothek.

 // Hier werden die cordova spezifischen Klassen importiert
import org.apache.cordova.CallbackContext;
import org.apache.cordova.CordovaInterface;
import org.apache.cordova.CordovaPlugin;
import org.apache.cordova.CordovaWebView;
// Hier werden einige Klassen für JSON importiert
import org.json.JSONArray;
import org.json.JSONException;
// Hier werden einige Klassen einer Telefon API eingebunden. Im Beispiel linphone
import org.linphone.core.Core;
import org.linphone.core.ProxyConfig;
import org.linphone.mediastream.Log;
// Die Klasse  vererbt von CordovaPlugin
public class mein_web_telefon extends CordovaPlugin
{
    public static Linphone mInstance;
    public static LinphoneMiniManager mLinphoneManager;
    public static Context mContext;
    ...
   @Override
    public void initialize(CordovaInterface cordova, CordovaWebView webView)
	{
        super.initialize(cordova, webView);
        this.cordova = cordova;
        mContext = cordova.getActivity().getApplicationContext();
        mLinphoneManager = new LinphoneMiniManager(mContext);
	...
    }
    //Die wichtige Funktion. Sie wird vom Javascript mit cordova.exec aufgerufen
    public boolean execute(String action, JSONArray args, CallbackContext callbackContext) throws JSONException
	{
        switch (action)
		{
			case "anrufen":

				mLinphoneManager.call(args.getString(0), args.getString(1), callbackContext);
				return true;
			case 'logon"
			....
		}
	}
}

Das Beispiel ist sehr vereinfacht und nicht lauffähig. Zuerst müsste das Plugin eine Verbindung zum Server herstellen, bevor es einen Anruf tätigen kann. Um die Funktionalität auch IOS Geräten zur Verfügung zu stellen müsste man eine ähnliche Bibliothek in Object-C oder Swift für das Apple Betriebssystem erstellen.

Damit das Plugin erfolgreich zum Beispiel mit „cordovar plugin add d:\\mein_web_telefon“ in ein Cordova Projekt hinzugefügt werden kann, muss sich im Stamm Verzeichnis eine Datei mit dem Namen „plugin.xml“ befinden. In dieser XML-Datei werden die Dateien aufgeführt, welche das Plugin für die verschiedenen Betriebssysteme benötigt. Auch Zugriffsrechte wie z. B. der Zugriff auf die Kamera müssen hier deklariert werden.

<?xml version="1.0" encoding="utf-8"?>
<plugin id="mein_web_telefon" version="1.1.4" xmlns="http://apache.org/cordova/ns/plugins/1.0" xmlns:android="http://schemas.android.com/apk/res/android">
  <name>Mein fantastisches Telefon Plugin</name>
  ...
  <!-- android -->
  <platform name="android">
   <config-file target="AndroidManifest.xml" parent="/manifest">
      <uses-permission android:name="android.permission.RECORD_AUDIO" />
      <uses-feature
          android:name="android.hardware.camera"
          android:required="false" />
      <uses-feature
          android:name="android.hardware.camera.autofocus"
          android:required="false" />
    </config-file>
    <config-file target="config.xml" parent="/*">
      <feature name="Linphone">
        <param name="android-package" value="com.sip.linphone.Linphone" />
      </feature>
    </config-file>
    ...
    <source-file src="src/android/src/Linphone.java" target-dir="src/com/sip/linphone" />
    ...
  </platform>

  <!-- ios -->
  <platform name="ios">
   <config-file target="config.xml" parent="/*">
      <feature name="Linphone">
        <param name="ios-package" value="Linphone"/>
      </feature>
    </config-file>
    <header-file src="src/ios/Linphone.h"/>
    <source-file src="src/ios/Linphone.m"/>
    <header-file src="src/ios/libs/apple-darwin/include/" />
    ...
    <source-file framework="true" src="src/ios/libs/apple-darwin/lib/mediastreamer/plugins/libmsamr.a" target-dir="lib/mediastreamer/plugins" />
    ...
  </platform>
</plugin>

Im Beispiel wird „android“ und „ios“ definiert mit den entsprechenden Dateien die das Plugin benötigt. Im Falle von „android“ handelt es sich um „.java“ Dateien, im Falle von „ios“ um „.h“ und „.m“ Dateien. Wie man sehen kann werden die Quellcode Dateien und weitere Dateien im Verzeichnis „src“ abgelegt getrennt nach „android“ und „ios“. Für diese zwei Betriebssysteme ist das Plugin geeignet.

Siehe auch

• Electron – ebenfalls ein Framework zur plattformunabhängigen Anwendungsentwicklung mit JS, HTML5 und CSS, jedoch für Desktop- statt Mobile-Anwendungen
• Vaadin TouchKit – Framework für die Erstellung endgeräteunabhängiger mobiler Applikationen in Java. Basiert ebenfalls auf Apache Cordova

Literatur

• Jeff Pelletier: Mobile App Manual: The Blueprint. 1. Auflage. Withinsight Publishing, 2013, ISBN 978-0-9890721-0-6 (englisch, mobileappmanual.com [abgerufen am 25. Oktober 2013]). 
• John M. Wargo: PhoneGap Essentials: Building Cross-Platform Mobile Apps. 1. Auflage. Addison-Wesley Professional, 2012, ISBN 978-0-321-81429-6 (englisch, phonegapessentials.com [abgerufen am 25. Oktober 2013]). 
• Jamie Munro: 20 Recipes for Programming PhoneGap: Cross-Platform Mobile Development for Android and iPhone. 1. Auflage. O’Reilly Media, 2012, ISBN 978-1-4493-1954-0 (englisch, oreilly.com [abgerufen am 25. Oktober 2013]). 
• Joshua Marinacci: Building Mobile Applications with Java: Using the Google Web Toolkit and PhoneGap. 1. Auflage. O’Reilly Media, 2012, ISBN 978-1-4493-0823-0 (englisch, oreilly.com [abgerufen am 25. Oktober 2013]). 
• Rohit Ghatol: Beginning PhoneGap: Mobile Web Framework for JavaScript and HTML5. 1. Auflage. 2011, ISBN 1-4302-3903-4 (englisch, apress.com [abgerufen am 25. Oktober 2013]). 
• Thomas Myer: Beginning PhoneGap. 1. Auflage. Wrox Press, 2011, ISBN 1-118-15665-X (englisch, wiley.com [abgerufen am 25. Oktober 2013]). 
• Ralph Steyer: Apps mit PhoneGap entwickeln. 1. Auflage. Carl Hansa Verlag, München 2013, ISBN 978-3-446-43510-0 (hanser-fachbuch.de). 

Weblinks

• Adobe PhoneGap
• Apache Cordova
• Apache Cordova Plugin-Entwicklung-Guide