Sociale app voor mobiel en web met verificatie

App Service - Mobile Apps
Functions
Traffic Manager
Visual Studio
Xamarin

Oplossingsidee

Als u wilt dat we dit artikel uitbreiden met meer informatie, zoals mogelijke use cases, alternatieve services, implementatieoverwegingen of prijsinformatie, laat het ons dan weten met GitHub Feedback!

Deze mobiele client-app biedt het delen van sociale afbeeldingen met een companion-web-app. De back-endservice van de app verwerkt achtergrondafbeeldingen met behulp van een Azure-functie en kan gebruikers op de hoogte stellen van de voortgang via een Notification Hub. Niet-afbeeldingsgegevens worden opgeslagen in Cosmos DB. De web-app heeft toegang tot de gegevens en afbeeldingen van de back-endservice via Traffic Manager.

De mobiele client-app werkt in de offlinemodus, zodat u afbeeldingen kunt weergeven en uploaden, zelfs wanneer u geen netwerkverbinding hebt.

De koppelingen naar rechts bieden documentatie over het implementeren en beheren van de Azure-producten die worden vermeld in de bovenstaande oplossingsarchitectuur.

Visual Studio Team Services

Visual Studio

Visual Studio Tools voor Xamarin

Application Insights

Visual Studio App Center

App Service Mobile Apps

Architectuur

Architectuurdiagram Download een SVG van deze architectuur.

Gegevensstroom

  1. Maak de app met Visual Studio en Xamarin.
  2. Voeg de Azure App Service Mobile Apps back-endservice toe aan de app-oplossing.
  3. Verificatie implementeren via id-providers voor sociale netwerken.
  4. Sla niet-afbeeldingsgegevens op in Cosmos DB cache in Azure Cache voor Redis.
  5. Geüploade afbeeldingen opslaan in Azure Blob Storage.
  6. Berichten in de wachtrij over nieuw geüploade afbeeldingen.
  7. Gebruik Azure Functions om berichten uit de geheugenruimte te verwijderen en afbeeldingen te verwerken die zijn opgehaald uit blobopslag.
  8. Pushmeldingen verzenden naar gebruikers via een Notification Hub.
  9. Bouw en test de app via Visual Studio App Center en publiceer deze.
  10. De distributie van gebruikersverkeer naar service-eindpunten in verschillende datacenters bepalen.
  11. Gebruik Application Insights om de app-service te bewaken.

Onderdelen

  • Bouw de webfront-end, mobiele apps en back-endservices met C# in Visual Studio 2017 of Visual Studio voor Mac.
  • Xamarin:maak mobiele apps voor iOS en Android met C# en Azure SDK's.
  • Visual Studio App Center:App Center maakt een continue integratie- en implementatiewerkstroom mogelijk door code op te halen uit BitBucket, GitHub en Visual Studio Team Services.
  • Een App Service web-app kan een klantgerichte web-app en een service hosten die wordt gebruikt door zowel de webclient als de mobiele client.
  • Gebruik Azure Functions voor serverloze achtergrondverwerking. Een Azure-functie kan bijvoorbeeld automatisch het wijzigen van het wijzigen van het aantal nieuwe blobs wanneer ze worden toegevoegd aan een container, terwijl een andere functie luistert naar berichten in een wachtrij om meerdere achtergrondafbeeldingen te verwijderen.
  • Toepassings Insights: detecteer problemen, diagnosticeert crashes en houdt het gebruik in uw web-app bij met Application Insights. Weloverwogen beslissingen nemen gedurende de ontwikkelingslevenscyclus.
  • Azure Cosmos DB is een volledig beheerde NoSQL-documentdatabaseservice. Het biedt query's en transactieverwerking via schemaloze gegevens, voorspelbare en betrouwbare prestaties en snelle ontwikkeling.
  • Azure Queue Storage wordt gebruikt voor duurzame berichten tussen App Service back-Azure Functions.
  • Blob Storage:Azure Storage host afbeeldingsbestanden om te profiteren van betere schaalbaarheid met lagere kosten. Communicatie tussen de web-app en de Azure-functie wordt vaak uitgevoerd met behulp van blobtriggers en Azure Queue Storage.
  • Azure Notification Hubs worden gebruikt voor schaalbare, platformoverschrijdende pushmeldingen.
  • Azure Traffic Manager bepaalt de distributie van gebruikersverkeer voor service-eindpunten in verschillende datacenters om een zeer responsieve en beschikbare toepassing te leveren.

Volgende stappen