탐색 건너뛰기

Social mobile and web app with authentication

This mobile client app offers social image sharing with a companion web app. The app back end service does background image processing using an Azure Function and can notify users of progress via a notification hub. Non-image data is stored in CosmosDB. The web app accesses the back end service data and images via Traffic Manager.

The mobile client app works in offline mode, allowing you to view and upload images even when you don’t have a network connection.

11 10 9 8 7 6 5 4 3 2 1

Create the app using Visual Studio and Xamarin.

Add the Azure App Service Mobile Apps back end service to the app solution.

Implement authentication through social identity providers.

Store non-image data in CosmosDB and cache it in Redis Cache.

Store uploaded images in Azure Blob Storage.

Queue messages about newly uploaded images.

Use Azure Functions to dequeue messages and process images retrieved from blob storage.

Send push notifications to users through a notification hub.

Build and test the app through Visual Studio App Center and publish it.

Control the distribution of user traffic to service endpoints in different datacenters.

Use Application Insights to monitor the app service.

  1. 1 Create the app using Visual Studio and Xamarin.
  2. 2 Add the Azure App Service Mobile Apps back end service to the app solution.
  3. 3 Implement authentication through social identity providers.
  4. 4 Store non-image data in CosmosDB and cache it in Redis Cache.
  5. 5 Store uploaded images in Azure Blob Storage.
  6. 6 Queue messages about newly uploaded images.
  1. 7 Use Azure Functions to dequeue messages and process images retrieved from blob storage.
  2. 8 Send push notifications to users through a notification hub.
  3. 9 Build and test the app through Visual Studio App Center and publish it.
  4. 10 Control the distribution of user traffic to service endpoints in different datacenters.
  5. 11 Use Application Insights to monitor the app service.

구현 지침

제품/설명 설명서

Visual Studio

Build the web front end, mobile apps, and back end services with C# in Visual Studio 2017 or Visual Studio for Mac.

Xamarin

Create mobile apps for iOS and Android using C# and Azure SDKs.

Visual Studio App Center

App Center enables a continuous integration and deployment workflow by pulling code from BitBucket, GitHub, and Visual Studio Team Services.

App Service

An App Service web app can host a customer-facing web app and a service that is used by both the web and mobile client.

Functions

Use Azure Functions for serverless background processing. For example, one Azure function can automatically resize new blobs when they're added to a container, while another function listens for messages on a queue in order to delete multiple background images.

Application Insights

Detect issues, diagnose crashes, and track usage in your web app with Application Insights. Make informed decisions throughout the development lifecycle.

Azure Cosmos DB

Azure Cosmos DB is a fully-managed NoSQL document database service. It offers querying and transaction-processing over schema-free data, predictable and reliable performance, and rapid development.

Queue storage

Azure Queue storage is used for durable messaging between the App Service backend and Azure Functions.

Blob storage

Images are stored in Azure Storage to take advantage of better scalability with lower cost. Communication between the web app and the Azure function is often performed using blob triggers and Azure Queue storage.

Notification Hubs

Azure Notification Hubs are used for scalable, cross-platform push notifications.

Traffic Manager

Azure Traffic Manager controls the distribution of user traffic for service endpoints in different datacenters in order to deliver a highly responsive and available application.

제품 정보

오른쪽 링크를 클릭하면 일부 제품을 배포 및 관리하는 방법에 대한 설명서가 제공됩니다.

관련 솔루션 아키텍처

5 3 9 4 6 8 7 1 2

작업 기반 소비자 모바일 앱

이 소비자 모바일 앱 아키텍처에서는 Azure App Service Mobile Apps를 사용하여 여러 소셜 ID 공급자를 이용한 인증을 간소화하고 오프라인 액세스를 위해 데이터를 저장하고 동기화하며 푸시 알림을 보냅니다.

1 2 3 4 5 6 7 8

사용자 지정 모바일 인력 앱

이 모바일 인력 앱 아키텍처는 Active Directory를 사용하여 Azure App Service API Management를 통해 장치로 전송된, SAP 백 엔드 시스템의 회사 데이터를 보호합니다.