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

App Service – Mobile Apps
Functions
Traffic Manager
Visual Studio
Xamarin

Lösungsidee

Wenn Sie möchten, dass wir diesen Artikel durch weitere Informationen, Implementierungsdetails, Preisinformationen oder Codebeispiele ergänzen, kontaktieren Sie uns über GitHub-Feedback.

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 Cosmos DB gespeichert. Die Web-App greift über Traffic Manager auf die Daten und Bilder des Back-End-Diensts zu.

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

Die Links auf der rechten Seite bieten Dokumentation zur Bereitstellung und Verwaltung der in der obigen Lösungsarchitektur aufgeführten Azure-Produkte.

Visual Studio Team Services

Visual Studio

Visual Studio-Tools für Xamarin

Application Insights

Visual Studio App Center

Mobile App Service-Apps

Aufbau

Architekturdiagramm Laden Sie eine SVG-Datei für diese 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. Speichern Sie Nicht-Bilddaten in Cosmos DB, und zwischenspeichern Sie sie in Azure Cache for Redis.
  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