Vier Möglichkeiten Webinhalte in Hybrid Apps anzuzeigen

Vier Möglichkeiten Webinhalte in Hybrid Apps anzuzeigen

Häufig wird in Apps in den Browser verlinkt, um zum Beispiel externe Links darzustellen oder allgemein Webinhalte anzuzeigen. Das geht zum Beispiel, indem der Systembrowser des Smartphones geöffnet wird. Schöner für den Benutzer ist es allerdings, wenn der Browser innerhalb der App geöffnet wird. Beim Schließen des Browsers kehrt der Benutzer so direkt zur App zurück.

1. In App Browser Plugin von Apache

Phonegap oder Cordova Apps können dafür das In App Browser Plugin von Apache nutzen. Der Vorteil des Plugins ist, dass es sehr gut funktioniert und in zahlreichen Apps erprobt wurde. Der Nachteil ist, dass der Browser alles andere als zeitgemäß aussieht. Das Anpassen des Stylings ist nur manuell und unter großem Aufwand möglich.

2. SafariViewController Plugin von Eddy Verbruggen

Das Problem des Stylings löst für iOS das SafariViewController Plugin von Eddy Verbruggen. Das Plugin nutzt die Safari View Controller Komponente von iOS 9 und öffnet die Webinhalte in dem für iOS Nutzer gewohnten Browser Kontext mit allen Features wie Sharing, Ladebalken und Vor- und Zurück-Navigation. Bei Klick auf „Fertig“ wird zur App zurückgekehrt. Für iOS 9 Devices ist diese Darstellung mit Sicherheit die beste Lösung, allerdings keine Option für Android oder iOS 8 Nutzer.

SafariViewController Plugin
Abb. Safari View Controller

3. Iframe

Eine weitere Möglichkeit, ist das Darstellen des Webinhalts in einem Iframe. Der Vorteil ist, dass sich alles um den Container beliebig stylen lässt. Nachteilig wirkt sich hingegen aus, dass Webseiten nicht automatisch für Mobilgeräte angepasst werden und andere Browser-Features wie eine Ladeanimation wegfallen.

4. Project Ace Plugin von Microsoft

Eine relativ neue Lösung bietet Microsoft mit dem so genannten Project Ace Plugin. Ace bietet Zugriff auf native UI Elemente und nativen APIs der jeweiligen Plattformen. So auch auf die native Webview. Über das Ace Plugin kann die Webview mit deutlich weniger Aufwand gestylt und verändert werden als mit dem In App Browser Plugin von Cordova selbst. Wir haben das Ace Plugin zum Beispiel in der rbb|24 App eingesetzt. Die externen Links öffnen so in einem Browser, der aber im Stil der App gestaltet ist. Der Nachteil an Ace ist, dass Android erst ab 4.4 unterstützt wird. Da das Plugin sehr neu ist, gibt es zudem die ein oder andere Inkompatibilität mit anderen Cordova Plugins, die sich in unserem Fall mit ein wenig Geduld lösen lassen konnten.

RBB24 Mobile App mit In App Browser
Abb. rbb|24 App: In App Browser mit Microsoft Ace Plugin

Leider gibt es derzeit keinen optimalen In App Browser für Cordova Apps. Unter diesen vier Möglichkeiten sollte aber für jeden Anwendungsfall etwas sein.