Bearbeiten

Social Media-App für Mobilgeräte und Web mit Authentifizierung

App Service – Mobile Apps
Functions
Traffic Manager
Visual Studio
Xamarin

Lösungsmöglichkeiten

Dieser Artikel ist ein Lösungsvorschlag. Wenn Sie möchten, dass wir diesen Artikel um weitere Informationen ergänzen, z. B. potenzielle Anwendungsfälle, alternative Dienste, Überlegungen zur Implementierung oder Preisempfehlungen, lassen Sie es uns über Feedback auf GitHub wissen.

Diese mobile Client-App ermöglicht das Teilen von Bildern in sozialen Netzwerken mit einer Begleit-Web-App. Der App-Back-End-Dienst führt die Hintergrundbildverarbeitung mithilfe einer Azure-Funktion durch und kann Benutzer per Notification Hub über den Fortschritt informieren. Nicht-Bilddaten werden in Azure Cosmos DB gespeichert. Die Web-App greift über Azure Traffic Manager auf die Daten und Bilder des Back-End-Diensts zu.

Sehen Sie sich die folgenden Dienste an, die in dieser Lösungsarchitektur vorgestellt werden:

Mögliche Anwendungsfälle

Die mobile Client-App wird im Offlinemodus ausgeführt, sodass Sie Bilder auch ohne Netzwerkverbindung anzeigen und hochladen können.

Aufbau

Das Architekturdiagramm zeigt den Weg vom Engineer zu Application Insights.Laden Sie ein SVG dieser Architektur herunter.

Datenfluss

  1. Erstellen Sie die App mithilfe von Visual Studio und Xamarin.
  2. Fügen Sie der App-Lösung den Azure-Back-End-Dienst Mobile App Service-Apps hinzu.
  3. Implementieren Sie die Authentifizierung über Identitätsanbieter für soziale Netzwerke.
  4. Sie können Nicht-Bilddaten in Azure Cosmos DB speicher und in Azure Cache for Redis zwischenspeichern.
  5. Speichern Sie hochgeladene Bilder in Azure Blob Storage.
  6. Stellen Sie Meldungen über neu hochgeladene Bilder in die Warteschlange.
  7. Verwenden Sie Azure Functions, um Meldungen aus der Warteschlange zu entfernen und aus Blob Storage abgerufene Bilder zu verarbeiten.
  8. Senden Sie über einen Notification Hub Pushbenachrichtigungen an Benutzer.
  9. Erstellen und testen Sie die App über Visual Studio App Center, und veröffentlichen Sie sie.
  10. Steuern Sie die Verteilung von Benutzerdatenverkehr für Dienstendpunkte in unterschiedlichen Rechenzentren.
  11. Verwenden Sie Application Insights, um den App Service zu überwachen.

Komponenten

  • Erstellen Sie mit C# in Visual Studio 2017 oder Visual Studio für Mac das Web-Front-End, mobile Apps und Back-End-Dienste.
  • Xamarin: Erstellen Sie mithilfe von C# und Azure SDKs mobile Apps für iOS und Android.
  • Visual Studio App Center: App Center ermöglicht einen Workflow für Continuous Integration und Deployment, indem Code per Pull aus BitBucket, GitHub und Visual Studio Team Services abgerufen wird.
  • Eine App Service-Web-App kann eine kundenbezogene Web-App und einen Dienst hosten, der sowohl vom Web- als auch vom mobilen Client genutzt wird.
  • Verwenden Sie Azure Functions für die serverlose Hintergrundverarbeitung. Beispielsweise kann eine Azure-Funktion die Größe neuer Blobs automatisch ändern, wenn sie einem Container hinzugefügt werden, während eine andere Funktion auf Meldungen in einer Warteschlange lauscht, um mehrere Hintergrundbilder zu löschen.
  • Application Insights: Erkennen Sie Probleme, diagnostizieren Sie Abstürze, und verfolgen Sie die Nutzung Ihrer Web-App mit Application Insights nach. Treffen Sie im gesamten Entwicklungslebenszyklus fundierte Entscheidungen.
  • Azure Cosmos DB ist ein vollständig verwalteter NoSQL-Dokumentdatenbankdienst. Er bietet Abfrage-und Transaktionsverarbeitung für schemafreie Daten, vorhersagbare und zuverlässige Leistung sowie eine schnelle Entwicklung.
  • Azure Queue Storage wird für stabiles Messaging zwischen dem App Service-Back-End und Azure Functions verwendet.
  • Blob Storage: In Azure Storage werden Bilddateien gehostet, um eine bessere Skalierbarkeit bei geringeren Kosten zu erzielen. Die Kommunikation zwischen der Web-App und der Azure-Funktion erfolgt häufig mithilfe von Blob-Triggern und Azure Queue Storage.
  • Azure Notification Hubs werden für skalierbare, plattformübergreifende Pushbenachrichtigungen verwendet.
  • Azure Traffic Manager steuert die Verteilung des Benutzerdatenverkehrs für Dienstendpunkte in verschiedenen Rechenzentren, um eine Anwendung mit hoher Reaktionsfähigkeit und Verfügbarkeit bereitzustellen.

Nächste Schritte