Heute sind mobile Lösungen für Unternehmenskunden

Transkript

1 Schwerpunkt Backend für mobile Lösungen mit den Azure Mobile Services Mittel gegen Rückenschmerzen Mobile Lösungen erfordern mehr als eine einfache App. Damit die Daten jederzeit auf allen Plattformen zur Verfügung stehen, ist ein Backend in der Cloud erforderlich, das sich mit den Mobile Services leicht umsetzen lässt. Auf einen Blick Michael Schuler arbeitet als Software Engineer für die Noser Engineering AG. Er interessiert sich für Softwarearchitektur, Clean Code, künstliche Intelligenz sowie.net im Allgemeinen. Martin Weber arbeitet als Senior Software Engineer für Noser Engineering AG. Nebst seiner Tätigkeit als Softwarearchitekt, Entwickler und Berater leitet er die Fachgruppe Cloud bei Noser Engineering. Inhalt Mobile Apps sind nur das Frontend umfangreicher Anwendungen. Azure Mobile Services für schnelle Backend-Lösungen. Eine Beispiel-App mit Backend. dnpcode A1407AzureMobile Heute sind mobile Lösungen für Unternehmenskunden nicht mehr nur einzelne kleine Applikationen, die auf einem Mobiltelefon oder Tablet laufen. Die Benutzer erwarten heute ganz selbstverständlich auch Funktionen wie Push Notifications, den vereinfachten Zugang zur App via Social-Media-Logins oder das Active Directory und die stete Verfügbarkeit der aktuellsten Daten auf allen Geräten und Plattformen. Mit einer mobilen App alleine lassen sich meist noch keine vollständigen Geschäftsprozesse realisieren. Clouddienste bilden die Geschäftslogik ab und die Mitarbeiter im Backoffice nutzen Desktopoder Webapplikationen, um bei ihrer täglichen Arbeit auf die Daten in der Cloud zuzugreifen. Mobile Apps sind daher oft nur ein kleiner Teil einer Gesamtlösung. Die Apps sind lediglich das Frontend, das die Schnittstelle zwischen User und dem Backend bildet. Die User Experience einer mobilen App hängt somit maßgeblich von einem zuverlässigen Backend ab, welches typischerweise folgende Aufgaben zu erfüllen hat: Datenhaltung Benutzerverwaltung (Authentisierung, Autorisierung) Business-Logik Middleware-Aufgaben wie Messaging (Push) und Anbindung anderer Dienste Administrationsfunktionen Abbildung 1 zeigt den typischen Kontext einer solchen mobilen Lösung. Die Microsoft Azure Mobile Services ermöglichen es, diese Anforderungen schnell und einfach umzusetzen, ohne dass zuerst ein Rechenzentrum mit zahlreichen Servern bereitgestellt werden muss. Außerdem benötigen ios- und Android-Entwickler kein Visual Studio, um die Services zu konfigurieren, da sämtlicher Code für die Logik serverseitig im Web über das Azure-Portal erstellt werden kann. Um zu veranschaulichen, wie die Azure Mobile Services diesen Anforderungen gerecht werden, soll eine News-App als Beispiel dienen, welche die folgenden Anforderungen zu erfüllen hat: Benutzer sollen Zugriff auf ausgewählte Unternehmens-News wie beispielsweise den Blog erhalten. Benutzer sollen Favoriten (Bookmarks) verwalten können. Die Favoriten sollen in der Cloud gespeichert werden, damit sie auf jedem Gerät verfügbar sind. Der Benutzer soll sich über ein bekanntes Login (Facebook, Microsoft-Konto et cetera) einloggen können. Benutzer sollen mittels Push-Notifications darüber informiert werden, dass neue Inhalte vorhanden sind. [Abb. 1] Kontext einer mobilen App

2 Schwerpunkt Administratoren sollen eine Synchronisation mit dem Blog anstoßen, Einträge in der Datenbank löschen und Push-Notifikationen versenden können. In einem realen Projektumfeld bekommt man beim ersten Kundenkontakt häufig Anforderungen dieser Art. Mithilfe dieser Informationen sollte es dann möglich sein, innerhalb kürzester Zeit einen ersten Prototyp zu erstellen. Oftmals ist es besser, den Stakeholdern schon sehr früh eine App zum Ausprobieren anzubieten, anstatt anhand einer abstrakten PowerPoint-Präsentation über die Lösung zu diskutieren. Aus diesem Grund soll auch in diesem Beispiel gleich mit dem Aufbau einer App für Mobilgeräte gestartet werden. Eine mobile App für Unternehmensnews Die mobile App besteht aus dem Haupt- Screen (siehe Abbildung 2) mit der gesamten Newsliste und dem Favoriten-Screen, [Abb. 2] Startseite der Beispiel-App mit allen News. Listing 1 Zugriff auf die Favoritentabelle. function read(query, user, request) query.where( userid: user.userid); request.execute(); function insert(item, user, request) console.log( "insert favorite: newsitemid:" + item.newsitemid + " userid:" + user.userid); var favoritetable = tables.gettable('favorite'); favoritetable.where( userid: user.userid, newsitemid: item.newsitemid ).read( success: function(results) if (results.length > 0) // Same favorite record was found. request.respond(400, error: 'Favorite for this news item already exists' ); console.log("favorite already exists"); else request.execute(); console.log("favorite added"); ); der die News enthält, die der Benutzer als Favorit markiert hat. Abbildung 3 zeigt die Tabelle Favorite im Azure-Management- Portal und in der laufenden App. Für die Datenhaltung werden die beiden Tabellen NewsItem und Favorite (siehe Abbildung 4) verwendet. In den Mobile Services werden entsprechende REST- Endpunkte für den Zugriff auf diese Tabellen generiert. Die Tabelle NewsItem speichert und verwaltet die einzelnen NewsItems. Die Administrationsapplikation extrahiert aus dem Blog (RSS-Feed) oder anderen Quellen den Titel, einen Abstract-Text und den URL zur Ressource und speichert die [Abb. 3] Die Favoriten im Azure-Management-Portal und in der laufenden App

3 Schwerpunkt Backend für mobile Lösungen mit den Azure Mobile Services Listing 2 API-Script für die Favoritenansicht. exports.get = function (request, response) console.log( userid: + request.user.userid); var sql = 'select n.* + 'from cloudnews.newsitem n inner join cloudnews.favorite f + 'on n.id = f.newsitemid + 'where f.userid =?'; console.log("sql: " + sql); var params = []; params.push(request.user.userid); request.service.mssql.query(sql, params, success: function (results) console.log("ok: " + results); response.json(statuscodes.ok, results);, error: function () console.log("error"); response.send(statuscodes.internal_server_error); ); ; Daten via Entity Framework in der SQL- Azure-Datenbank in der Cloud. Der mobile Client kann diese Tabelle lesen, ohne sich extra dafür authentifizieren zu müssen. Alle schreibenden Operationen sind gesperrt. Die Tabelle Favorite speichert die Favoriten eines Anwenders mit der UserId. Zu diesem Zweck müssen die Scripts für den Zugriff angepasst werden: Read und Insert werden auf autorisierte Anwender eingeschränkt. Update und Delete sind aktuell nicht implementiert und daher ist der Zugriff nur für Administratoren und Scripts erlaubt. Serverseitige Scripts Für den Zugriff auf die Tabelle Favorite werden die Scripts (siehe Abbildung 5) für die Funktionen Read und Insert implementiert (siehe Listing 1). Read liefert nur die Favoriten des aktuell angemeldeten Benutzers zurück. Insert prüft, ob bereits [Abb. 4] Datenmodell der Beispiel-App mit den Tabellen NewsItem und Favorite. [Abb. 5] Skript für das Einfügen von Daten in die Tabelle Favorite. ein Favorit für diesen User und dieses NewsItem vorhanden ist, und fügt ein neues Item nur dann hinzu, wenn es noch nicht existiert. Die Ansicht der Favoriten ist eine View auf die NewsItems, für welche der Benutzer Favoriten angelegt hat. Eine solche View muss mittels eines APIs realisiert werden. Das API ist hier ein Node.js- Script, das für die gewünschte HTTP-Methode implementiert wird, im vorliegenden Fall also GET (siehe Listing 2). Über request.service erhält man Zugriff auf das Objekt MobileService, das wiederum via mssql den Zugriff auf SQL Azure ermöglicht. Über das SQL-Statement in der Variablen sql werden alle NewsItems für die Favoriten des Benutzers abgerufen. Die userid des aufrufenden Users wird im Beispiel als Parameter übergeben, der das Fragezeichen im SQL-Statement ersetzt. Wie bei Node.js üblich, wird die Query Listing 3 Die Klasse NewsItem. using Newtonsoft.Json; namespace nosernews.model public class NewsItem public int Id get; set; [JsonProperty(PropertyName = "title")] public string Title get; set; [JsonProperty(PropertyName = "abstract")] public string Abstract get; set; [JsonProperty(PropertyName = "url")] public string Url get; set;

4 Listing 4 Schwerpunkt TT rainings Die Klasse Favorite. using System; using Newtonsoft.Json; namespace nosernews.model public class Favorite public int Id get; set; [JsonProperty(PropertyName = "newsitemid")] public int NewsItemId get; set; [JsonProperty(PropertyName = "userid", NullValueHandling = NullValueHandling.Ignore)] public String UserId get; set; [JsonProperty(PropertyName = "date", NullValueHandling = NullValueHandling.Ignore)] public DateTime? Date get; set; asynchron ausgeführt und ruft im Erfolgsfall das success-callback auf, welches das Resultat als JSON-Objekt mit dem Statuscode OK (200) an den Client zurückliefert. Im Fehlerfall wird eine Meldung mit dem Statuscode INTERNAL_SERVER_ERROR (500) an den Client gesendet. Clientseitiger Code Die beiden Modelle für NewsItem (siehe Listing 3) und Favorite (siehe Listing 4) werden im Client-Code als Klassen mit JsonProperty-Attributen realisiert. Auf diese Klassen kann dann über die GetTable-Methode des Objekts MobileService zugegriffen werden: IMobileServiceTable newstable = App.MobileService.GetTable< NewsItem>(); IMobileServiceTable favoritestable = App.MobileService.GetTable< Favorite>(); Um die Tabellen zu lesen, wird eine Extension-Methode verwendet: // MobileServiceCollectionView implements // ICollectionView (useful for databin- // ding to lists) MobileServiceCollection newsitems = await newstable.tocollectionasync(); Um ein Objekt in eine Tabelle zu schreiben, wird die Methode InsertAsync verwendet, welche über die Insert-Funktion (siehe Listing 1) ein NewsItem in der Datenbank speichert: var favorite = new Favorite(); favorite.newsitemid = newsitem.id; favorite.userid = App.MobileService. CurrentUser.UserId; favorite.date = DateTime.Now; await favoritestable.insertasync( favorite); Zugriff auf das API-Script Der Zugriff auf die Favoriten-View über das API gestaltet sich ebenso einfach. Der Methode InvokeAPIAsync werden der Name des APIs, die gewünschte Zugriffsart (HTTP-Methode) und ein Parameter-Dictionary (bleibt hier leer) übergeben: var favorite = new Favorite(); favorite.newsitemid = newsitem.id; favorite.userid = App.MobileService. CurrentUser.UserId; favorite.date = DateTime.Now; await favoritestable.insertasync( favorite); Nutzer autorisieren Die Anmeldung über einem vorhandenen Identity-Provider (Microsoft-Account, Facebook, Twitter, Google+) erfordert lediglich das Registrieren der App auf der entsprechenden Entwicklerseite des Identity-Providers. Anschließend können die App-ID und das Secret, welches man erhält, in den Azure Mobile Service unter Identity eingetragen werden. Ist dies erledigt, kann man den Benutzer über die Methode Login- Async autorisieren: Upgrades für Ihr Know-How Auch Entwickler sollten hin und wieder das Kleingedruckte lesen. Antje Kilián Spezialistin für Vertrags-, Urheber-, Lizenz- und Computerstrafrecht IT-Recht für Entwickler Trainer: Antje Kilián , Köln , München , Hamburg Frühbucherpreis: EUR 1.799,- zzgl. MwSt. Normalpreis: EUR 1.999,- zzgl. MwSt. Visual Studio 2013 Trainer: David Tielke München Berlin Frühbucherpreis: EUR 2.199,- zzgl. MwSt. Normalpreis: EUR 2.399,- zzgl. MwSt. Weitere Informationen zu den Inhalten der Trainings finden Sie auf der Website. developer-media.de/trainings

5 Schwerpunkt Backend für mobile Lösungen mit den Azure Mobile Services Listing 5 Zugriff auf den Notification Hub. using System; using System.Collections.Generic; using System.Threading.Tasks; using Microsoft.Phone.Notification; using Microsoft.WindowsAzure.Messaging; namespace nosernews public static class NotificationHandler TODO: enter the hubname private const string HubName = ""; TODO: enter the DefaultListenSharedAccessSignature private const string HubConnectionString = ""; public static void Register( Action<IDictionary> ontoastmessagewhilerunning = null) var channel = HttpNotificationChannel.Find("MyPushChannel"); if (channel == null) channel = new HttpNotificationChannel("MyPushChannel"); channel.open(); channel.bindtoshelltoast(); channel.channeluriupdated += async (o, args) => var hub = new NotificationHub(HubName, HubConnectionString); await hub.registernativeasync(args.channeluri.tostring()); ; if (ontoastmessagewhilerunning!= null) channel.shelltoastnotificationreceived += (sender, args) => ontoastmessagewhilerunning(args.collection); await App.MobileService.LoginAsync( MobileServiceAuthenticationProvider.Twitter); Anschließend ist der Zugriff auf das Objekt MobileServiceUser unter App.MobileService.CurrentUser möglich. Dieses User-Objekt wird bei jedem Zugriff auf Daten oder APIs im Backend mitgegeben und taugt dort für die Zuordnung der Daten zu einem Anwender. Push-Notifications Push-Benachrichtigungen für alle Plattformen lassen sich am einfachsten über Azure Service Bus Notification Hubs ein- richten. Damit ist es möglich, Nachrichten über eine zentrale Stelle an Plattform- Notification-Systeme (PNS) zu senden. Aktuell kann man Benachrichtigungen für folgende Plattformen konfigurieren: Windows Windows Phone Apple Google Cloud (Android) Ähnlich wie bei Identity-Providern muss man sich auch hier zuerst auf der Entwicklerseite des jeweiligen PNS registrieren und anschließend das Zertifikat oder den Key in Azure-Portal zum Notification Hub hinzufügen. In der Windows- Phone-Applikation benötigt man das NuGet-Paket WindowsAzure.Messaging. Managed für den Zugriff auf den Service Bus Notification Hub (siehe Listing 5). In der Administratoren-Applikation benötigt man das NuGet-Paket Windows- Azure.ServiceBus, um eine Nachricht an Windows-Phone-Geräte als Toast-Message zu versenden (siehe Listing 6). Es wird hier die plattformspezifische Methode Send- MpnsNativeNotificationAsync für Windows Phone (MPNS) verwendet. Zudem existiert die Methode SendNotificationAsync für Notification Templates, die eine generischere Möglichkeit bietet. Weitere Informationen dazu finden Sie in [1] und [2]. [Abb. 6] Das Skript zum Einfügen von Daten in die Favoriten-Tabelle im Server Explorer

6 Schwerpunkt Fazit Es begeistert, wie schnell man mit den Windows Azure Mobile Services eine mobile App mit Cloud-Backend erstellen kann. Für die beschriebene Lösung, bestehend aus Windows-Phone-App, Konsolen-Applikation für Administratoren und Cloud-Backend, benötigt man mit etwas Übung zirka einen Arbeitstag vom Konzept bis zum lauffähigen Prototyp. Etwas zeitaufwendig war das Debuggen des serverseitigen JavaScript-Codes. Allerdings wird die Integration in Visual Studio laufend verbessert. Visual Studio 2013 bietet über den Serverexplorer bereits Zugriff auf die Mobile Services Scripts (siehe Abbildung 6), auch wenn das Debuggen noch auf sich warten lässt. Weitere Details dazu sind in [3] beschrieben. [bl] [1] Damir Dobric, Nachricht an alle, Azure Service Bus Notification Hubs, dotnetpro 2/2014, Seite 58 ff., [2] Notification Hubs Documentation, [3] Working with mobile services in Visual Studio, Listing 6 Die Administrator-App. <summary> TODO: Enter the name of the notification hub </summary> private const string HubName = "<hubname>"; <summary> TODO: Enter the DefaultFullSharedAccessSignature </summary> private const string HubConnectionString = '<hub-connection-string>'; private static async void SendNotificationAsync(string message) NotificationHubClient hub = NotificationHubClient.CreateClientFromConnectionString( HubConnectionString, HubName); string toast = "<?xml version=\"1.0\" encoding=\"utf-8\"?>" + "<wp:notification xmlns:wp=\"wpnotification\">" + "<wp:toast>" + "<wp:text1>" + message + "</wp:text1>" + "</wp:toast> " + "</wp:notification>"; await hub.sendmpnsnativenotificationasync(toast); dotnetpro Online dotnetpro.de facebook.de/dotnetpro twitter.com/dotnetpro_mag gplus.to/dotnetpro Top-Informationen für den.net-entwickler. Klicken. Lesen. Mitreden.