Switch branches/tags
Nothing to show
Find file Copy path
Fetching contributors…
Cannot retrieve contributors at this time
89 lines (55 sloc) 6.28 KB

Azure Functions & Web App Service Demo Setup

In order to run through the demo scripts in this repo you will need to set up your own environment.

There are two demos that show the power of .NET Core, Visual Studio and Azure. The first one demonstrates the ability to easily develop and debug C# Azure Functions in Visual Studio 2017. This demo shows how the hotel only allows dogs by asking the customer to upload a picture of their pet.

The second demo shows how Application Insights is automatically configured and monitoring the health of your .NET Core apps in Azure App Service. It also shows how to debug production exceptions with the new snapshot debugging.

In order to show these demos, you need to have the services deployed to your own Azure subscription. The step-by-step demo scripts are available here:

Creating The Azure Resources

The first step is to create the needed Azure resources: The Azure Function, the Blob Storage (for storing the pets images), the Cosmos DB (stores documents with the pet information), the Vision API, SignalR Service and for the website the App Service, Service Plan and Application Insights.

To create these resources we have the following ARM template:

Deploy to Azure

Once the resources are created you need to do some manual steps:

  1. Create a blob storage container called pets in the storage account and ensure it has public access

Public Blob Storage

  1. Create a database called pets in Cosmos DB. Then add a collection called checks.

Cosmos DB Collection

Setting Up The Website with the Function

When the website starts up, it looks for the SettingsUrl in the appsetting.json file. This variable must contain an URL to a configuration file. By default, the setting used is a public endpoint. If you want change the values you can do it in the Production if you are using a Release configuration or Development if you are using a Debug configuration.

  • Open the file appsettings.Development.json or appsettings.Production.json according to your Build configuration. Then edit the PetsConfig section with the desired values:

    • blobName: The name of the storage account
    • blobKey: The key to the storage account
    • cosmosUri: The uri of the Cosmos DB created (i.e.
    • cosmosKey: The key of the Cosmos DB created
    • api: The URL of your Azure Function

Deploying the Website to Azure App Service

Once the resources and settings are created, you can publish the website to App Service. First, enable Application Insights monitoring by selecting Application Insights tab on the App Service and clicking on the banner.

Enable App Insights

In Visual Studio 2017 select the Website project in the Solution Explorer and use the quick search bar for "Add Application Insights". Select "Start Free", then choose "existing resource". Select the Application Insights resource associated with the App Service.

Now you can publish the website to App Service using the Visual Studio 2017 Publish feature. Just select "Existing App Service" and specify your resource group.

Run the Azure Function locally

To run the Azure Function locally you can use Visual Studio 2017 15.5 or higher and start debugging the Azure Function project (WebsiteFunction). Make sure to edit the local.settings.json file with the values of your environment first:

  "IsEncrypted": false,
  "Values": {
    "AzureWebJobsDashboard": "",
    "cosmos_uri": "",
    "cosmos_key": "PUT YOUR COSMOSDB KEY HERE",
    "constr": "PUT YOUT COSMOSDB CONNECTION STRING AccountEndpoint=....;",
    "MicrosoftVisionApiKey": "PUT YOUR VISION API KEY HERE",
    "MicrosoftVisionApiEndpoint": "PUT YOUR API ENDPOINT HERE (i.e.",
    "MicrosoftVisionNumTags": "10"

Now, you should be able to run both the function and the azure function locally and debug it. If it is not working ensure that the configuration is correct. If the Azure Function is not triggered be sure that:

  1. The blob container has public access.
  2. The local.settings.json file contains the correct cosmos_uri, cosmos_key and constr values
  3. The website uses the correct configuration settings from SettingsUrl. It should save the images in a blob container called pets in your storage. It should also create documents in a collection called checks in a database pets. You can verify this using the Data Explorer. Be sure that the both database and collection exists on Cosmos DB:

Pets document in Cosmos DB

Deploying the Function to Azure

Once you have the Function app running locally per above instructions, you can use the Visual Studio 2017 Publish feature to publish the Azure Function. Select publish to an existing Function App and specify your resource group.

The function will NOT be published with values of the local.settings.json file. You need to add these keys manually in the publish wizard the first time you publish.

Func App Settings