Building an Azure Cognitive Services Face App – Part 1 Face Recognition


In this post we will go through an example of using Azure’s Cognitive Services Face Recognition functionality. This app will be built in C# and will take a given photo/image and upload it to Azure Cognitive Services, then determine what are faces within the image using DetectWithStreamAsync, and finally draw a rectangle around those faces.

Let’s build the app.

First you will need to sign up for an Azure Cognitive Services API key for Face.

Now in Visual Studio, create a new WPF app:

You will see:

Drag an image control, Image1, onto the form and resize it accordingly:

Add a Browse button:

Open NuGet and install the package:

Install-Package Microsoft.Azure.CognitiveServices.Vision.Face -Version 2.2.0-preview

Now, double click on the Browser button and change the method to async:

We will be using:

  • Microsoft.Azure.CognitiveServices.Vision.Face
  • Microsoft.Azure.CognitiveServices.Vision.Face.Models

Add the code to MainWindows.xaml.cs and add your subscription key and base URI from above. This code uses the Face API’s DetectWithStreamAsync method to determine the faces in a photo:

using Microsoft.Azure.CognitiveServices.Vision.Face;
using Microsoft.Azure.CognitiveServices.Vision.Face.Models;
using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace Carl.FaceAPI

    /// Interaction logic for MainWindow.xaml
    /// </summary>

    public partial class MainWindow : Window
        private const string subscriptionKey = "yourapikey";

        private const string baseUri =
            "yoururl"; // E.g.

        private readonly IFaceClient faceClient = new FaceClient(
            new ApiKeyServiceClientCredentials(subscriptionKey),
            new System.Net.Http.DelegatingHandler[] { });

        IList<DetectedFace> faceList;
        String[] faceDescriptions;
        double resizeFactor;

        public MainWindow()

            faceClient.Endpoint = baseUri;


        private async void btnBrowse_Click(object sender, RoutedEventArgs e)
            var dialog = new Microsoft.Win32.OpenFileDialog();
            dialog.Filter = "JPG (*.jpg)|*.jpg";
            bool? result = dialog.ShowDialog(this);

            if (!(bool)result)

            string filePath = dialog.FileName;
            Uri uriSource = new Uri(filePath);
            BitmapImage source = new BitmapImage();

            source.CacheOption = BitmapCacheOption.None;
            source.UriSource = uriSource;

            Image1.Source = source;

            faceList = await UploadAndDetectFaces(filePath);

            if (faceList.Count > 0)
                DrawingVisual visual = new DrawingVisual();
                DrawingContext context = visual.RenderOpen();
                context.DrawImage(source, new Rect(0, 0, source.Width, source.Height));
                double dpi = source.DpiX;
                resizeFactor = (dpi > 0) ? 96 / dpi : 1;
                faceDescriptions = new String[faceList.Count];

                for (int i = 0; i < faceList.Count; ++i)
                    DetectedFace face = faceList[i];

                        new Pen(Brushes.Green, 5),
                        new Rect(
                            face.FaceRectangle.Left * resizeFactor,
                            face.FaceRectangle.Top * resizeFactor,
                            face.FaceRectangle.Width * resizeFactor,
                            face.FaceRectangle.Height * resizeFactor

                RenderTargetBitmap facewithRectangle = new RenderTargetBitmap(
                    (int)(source.PixelWidth * resizeFactor),
                    (int)(source.PixelHeight * resizeFactor),

                Image1.Source = facewithRectangle;

        private async Task<IList<DetectedFace>> UploadAndDetectFaces(string imageFilePath)
                using (Stream imageFileStream = File.OpenRead(imageFilePath))
                    IList<DetectedFace> faceList =
                        await faceClient.Face.DetectWithStreamAsync(
                            imageFileStream, true, false, null);
                    return faceList;
            catch (APIErrorException f)
                return new List<DetectedFace>();
            catch (Exception e)
                MessageBox.Show(e.Message, "Error");
                return new List<DetectedFace>();

Run the code and press Browse. You will see the API has captured 2 faces:

Try again with a photo of one person:



Carl de Souza is a developer and architect focusing on Microsoft Dynamics 365, Power BI, Azure, and AI.

carldesouza.comLinkedIn Twitter | YouTube


3 Responses to Building an Azure Cognitive Services Face App – Part 1 Face Recognition

  1. Por favor,
    o Package Microsoft.Azure.CognitiveServices.Vision.Face não está mais disponivel para instalação no nuget.

    Como proceder?

  2. Please,
    the Microsoft.Azure.CognitiveServices.Vision.Face Package is no longer available for installation in the nuget.

    How to proceed?

Leave a Reply

Your email address will not be published. Required fields are marked *