使用Azure人脸API对图片进行人脸识别

人脸识别是人工智能机器学习比较成熟的一个领域。人脸识别已经应用到了很多生产场景。比如生物认证，人脸考勤，人流监控等场景。对于很多中小功能由于技术门槛问题很难自己实现人脸识别的算法。Azure人脸API对人脸识别机器学习算法进行封装提供REST API跟SDK方便用户进行自定义开发。

Azure人脸API可以对图像中的人脸进行识别，返回面部的坐标、性别、年龄、情感、愤怒还是高兴、是否微笑，是否带眼镜等等非常有意思的信息。
Azure人脸API也是一个免费服务，每个月30000次事务的免费额度。

创建人脸服务

填写实例名，选择一个区域，同样选离你近的。

获取秘钥跟终结点

选中侧边菜单“秘钥于终结点”，获取信息，这2个信息后面再sdk调用中需要用到。

新建WPF应用

新建一个WPF应用实现以下功能：

1. 选择图片后把原图显示出来

2. 选中后马上进行识别

3. 识别成功后把脸部用红框描述出来

4. 当鼠标移动到红框内的时候显示详细脸部信息

安装SDK

使用nuget安装对于的sdk包：

1. Install-Package Microsoft.Azure.CognitiveServices.Vision.Face -Version 2.5.0-preview.2

实现界面

编辑MainWindow.xml放置图像显示区域、文件选中、描述显示区域

1. <Window x:Class="FaceWpf.MainWindow"

2. xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

3. xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

4. xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

5. xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

6. xmlns:local="clr-namespace:FaceWpf"

7. mc:Ignorable="d"

8. Title="MainWindow" Height="600" Width="800">

9. <Grid x:Name="BackPanel">

10. <Image x:Name="FacePhoto" Stretch="Uniform" Margin="0,0,0,50" MouseMove="FacePhoto_MouseMove" />

11. <DockPanel DockPanel.Dock="Bottom">

12. <Button x:Name="BrowseButton" Width="72" Height="80" VerticalAlignment="Bottom" HorizontalAlignment="Left"

13. Content="选择图片..."

14. Click="BrowseButton_Click" />

15. <StatusBar VerticalAlignment="Bottom">

16. <StatusBarItem>

17. <TextBlock Name="faceDescriptionStatusBar" Height="80" FontSize="20" Text="" Width="500" TextWrapping="Wrap"/>

18. </StatusBarItem>

19. </StatusBar>

20. </DockPanel>

21. </Grid>

22. </Window>

构造函数

在编辑MainWindow类的构造函数初始化FaceClient等数据

1. private IFaceClient _faceClient;

3. //检测到的人脸

4. private IList<DetectedFace> _faceList;

5. //人脸描述信息

6. private string[] _faceDescriptions;

7. private double _resizeFactor;

9. private const string _defaultStatusBarText =

10. "鼠标移动到面部显示描述信息.";

11. public MainWindow()

12. {

13. InitializeComponent();

14. //faceid的订阅key

15. string subscriptionKey = "";

16. // faceid的终结的配置

17. string faceEndpoint = "";

18. _faceClient = new FaceClient(

19. new ApiKeyServiceClientCredentials(subscriptionKey),

20. new System.Net.Http.DelegatingHandler[] { });

21. if (Uri.IsWellFormedUriString(faceEndpoint, UriKind.Absolute))

22. {

23. _faceClient.Endpoint = faceEndpoint;

24. }

25. else

26. {

27. MessageBox.Show(faceEndpoint,

28. "Invalid URI", MessageBoxButton.OK, MessageBoxImage.Error);

29. Environment.Exit(0);

30. }

31. }

图片选择并显示

1. // 选择图片并上传

2. private async void BrowseButton_Click(object sender, RoutedEventArgs e)

3. {

4. var openDlg = new Microsoft.Win32.OpenFileDialog();

6. openDlg.Filter = "JPEG Image(*.jpg)|*.jpg";

7. bool? result = openDlg.ShowDialog(this);

9. if (!(bool)result)

10. {

11. return;

12. }

14. // Display the image file.

15. string filePath = openDlg.FileName;

17. Uri fileUri = new Uri(filePath);

18. BitmapImage bitmapSource = new BitmapImage();

20. bitmapSource.BeginInit();

21. bitmapSource.CacheOption = BitmapCacheOption.None;

22. bitmapSource.UriSource = fileUri;

23. bitmapSource.EndInit();

25. FacePhoto.Source = bitmapSource;

27. // Detect any faces in the image.

28. Title = "识别中...";

29. _faceList = await UploadAndDetectFaces(filePath);

30. Title = String.Format(

31. "识别完成. {0}个人脸", _faceList.Count);

33. if (_faceList.Count > 0)

34. {

35. // Prepare to draw rectangles around the faces.

36. DrawingVisual visual = new DrawingVisual();

37. DrawingContext drawingContext = visual.RenderOpen();

38. drawingContext.DrawImage(bitmapSource,

39. new Rect(0, 0, bitmapSource.Width, bitmapSource.Height));

40. double dpi = bitmapSource.DpiX;

41. // Some images don't contain dpi info.

42. _resizeFactor = (dpi == 0) ? 1 : 96 / dpi;

43. _faceDescriptions = new String[_faceList.Count];

45. for (int i = 0; i < _faceList.Count; ++i)

46. {

47. DetectedFace face = _faceList[i];

49. //画方框

50. drawingContext.DrawRectangle(

51. Brushes.Transparent,

52. new Pen(Brushes.Red, 2),

53. new Rect(

54. face.FaceRectangle.Left * _resizeFactor,

55. face.FaceRectangle.Top * _resizeFactor,

56. face.FaceRectangle.Width * _resizeFactor,

57. face.FaceRectangle.Height * _resizeFactor

58. )

59. );

61. _faceDescriptions[i] = FaceDescription(face);

62. }

64. drawingContext.Close();

66. RenderTargetBitmap faceWithRectBitmap = new RenderTargetBitmap(

67. (int)(bitmapSource.PixelWidth * _resizeFactor),

68. (int)(bitmapSource.PixelHeight * _resizeFactor),

69. 96,

70. 96,

71. PixelFormats.Pbgra32);

73. faceWithRectBitmap.Render(visual);

74. FacePhoto.Source = faceWithRectBitmap;

76. faceDescriptionStatusBar.Text = _defaultStatusBarText;

77. }

78. }

调用SDK进行识别

指定需要识别的要素，调用sdk进行图像识别

1. // 上传图片使用faceclient识别

2. private async Task<IList<DetectedFace>> UploadAndDetectFaces(string imageFilePath)

3. {

4. IList<FaceAttributeType> faceAttributes =

5. new FaceAttributeType[]

6. {

7. FaceAttributeType.Gender, FaceAttributeType.Age,

8. FaceAttributeType.Smile, FaceAttributeType.Emotion,

9. FaceAttributeType.Glasses, FaceAttributeType.Hair

10. };

12. using (Stream imageFileStream = File.OpenRead(imageFilePath))

13. {

14. IList<DetectedFace> faceList =

15. await _faceClient.Face.DetectWithStreamAsync(

16. imageFileStream, true, false, faceAttributes);

17. return faceList;

18. }

19. }

显示脸部的描述

对人脸识别后的结果信息组装成字符串，当鼠标移动到人脸上的时候显示这些信息。

1. /// <summary>

2. /// 鼠标移动显示脸部描述

3. /// </summary>

4. /// <param name="sender"></param>

5. /// <param name="e"></param>

6. private void FacePhoto_MouseMove(object sender, MouseEventArgs e)

7. {

8. if (_faceList == null)

9. return;

11. Point mouseXY = e.GetPosition(FacePhoto);

13. ImageSource imageSource = FacePhoto.Source;

14. BitmapSource bitmapSource = (BitmapSource)imageSource;

16. var scale = FacePhoto.ActualWidth / (bitmapSource.PixelWidth / _resizeFactor);

18. bool mouseOverFace = false;

20. for (int i = 0; i < _faceList.Count; ++i)

21. {

22. FaceRectangle fr = _faceList[i].FaceRectangle;

23. double left = fr.Left * scale;

24. double top = fr.Top * scale;

25. double width = fr.Width * scale;

26. double height = fr.Height * scale;

28. if (mouseXY.X >= left && mouseXY.X <= left + width &&

29. mouseXY.Y >= top && mouseXY.Y <= top + height)

30. {

31. faceDescriptionStatusBar.Text = _faceDescriptions[i];

32. mouseOverFace = true;

33. break;

34. }

35. }

37. if (!mouseOverFace) faceDescriptionStatusBar.Text = _defaultStatusBarText;

38. }

1. /// <summary>

2. /// 脸部描述

3. /// </summary>

4. /// <param name="face"></param>

5. /// <returns></returns>

6. private string FaceDescription(DetectedFace face)

7. {

8. StringBuilder sb = new StringBuilder();

10. sb.Append("人脸: ");

12. // 性别年龄

13. sb.Append(face.FaceAttributes.Gender.Value == Gender.Female ? "女性" : "男性");

14. sb.Append(", ");

15. sb.Append(face.FaceAttributes.Age.ToString() + "岁");

16. sb.Append(", ");

17. sb.Append(String.Format("微笑 {0:F1}%, ", face.FaceAttributes.Smile * 100));

19. // 显示超过0.1的表情

20. sb.Append("表情: ");

21. Emotion emotionScores = face.FaceAttributes.Emotion;

22. if (emotionScores.Anger >= 0.1f) sb.Append(

23. String.Format("生气 {0:F1}%, ", emotionScores.Anger * 100));

24. if (emotionScores.Contempt >= 0.1f) sb.Append(

25. String.Format("蔑视 {0:F1}%, ", emotionScores.Contempt * 100));

26. if (emotionScores.Disgust >= 0.1f) sb.Append(

27. String.Format("厌恶 {0:F1}%, ", emotionScores.Disgust * 100));

28. if (emotionScores.Fear >= 0.1f) sb.Append(

29. String.Format("恐惧 {0:F1}%, ", emotionScores.Fear * 100));

30. if (emotionScores.Happiness >= 0.1f) sb.Append(

31. String.Format("高兴 {0:F1}%, ", emotionScores.Happiness * 100));

32. if (emotionScores.Neutral >= 0.1f) sb.Append(

33. String.Format("自然 {0:F1}%, ", emotionScores.Neutral * 100));

34. if (emotionScores.Sadness >= 0.1f) sb.Append(

35. String.Format("悲伤 {0:F1}%, ", emotionScores.Sadness * 100));

36. if (emotionScores.Surprise >= 0.1f) sb.Append(

37. String.Format("惊喜 {0:F1}%, ", emotionScores.Surprise * 100));

39. sb.Append(face.FaceAttributes.Glasses);

40. sb.Append(", ");

42. sb.Append("头发: ");

44. if (face.FaceAttributes.Hair.Bald >= 0.01f)

45. sb.Append(String.Format("秃头 {0:F1}% ", face.FaceAttributes.Hair.Bald * 100));

47. IList<HairColor> hairColors = face.FaceAttributes.Hair.HairColor;

48. foreach (HairColor hairColor in hairColors)

49. {

50. if (hairColor.Confidence >= 0.1f)

51. {

52. sb.Append(hairColor.Color.ToString());

53. sb.Append(String.Format(" {0:F1}% ", hairColor.Confidence * 100));

54. }

55. }

57. return sb.ToString();

58. }

运行

到此我们的应用打造完成了。先让我们选择一张结衣的图片试试：

看看我们的结衣微笑率97.9%。

再选一张杰伦的图片试试：

嗨，杰伦就是不喜欢笑，微笑率0% 。。。

总结

通过简单的一个wpf的应用我们演示了如果使用Azure人脸API进行图片中的人脸检测，真的非常方便，识别代码只有1行而已。如果不用C# sdk还可以使用更加通用的rest api来调用，这样可以适配任何开发语言。Azure人脸API除了能对图片中的人脸进行检测，还可以对多个人脸进行比对，检测是否是同一个人，这样就可以实现人脸考勤等功能了，这个下次再说吧。