Fácil detección facial en su aplicación PHP Laravel

Detecta rostros en imágenes con la API de Google Cloud Vision

Probablemente hayas visto la detección facial antes. Tan pronto como suba esa foto familiar a Facebook, notará los cuadros alrededor de todos los rostros detectados. Y con el reconocimiento facial , a veces incluso etiqueta automáticamente al amigo correcto. No siempre es 100% preciso, ¡pero sigue siendo una gran ingeniería!

Aplicaciones para detección facial

En este artículo, comenzaremos a utilizar la API de Google Cloud Vision para detectar rostros. Usaremos una imagen existente y dibujaremos un cuadro alrededor de cada rostro detectado.

Hay varios casos de uso del mundo real para la detección facial. Algunos de estos incluyen:

  • detectar si una imagen cargada tiene alguna cara. Este podría ser un paso de selección como parte de un flujo de trabajo de identificación "conozca a su cliente".
  • moderación de imágenes para aplicaciones que permiten contenido generado por el usuario.
  • la capacidad de proporcionar etiquetado, de la misma manera que lo hacen las redes sociales.

Otras funciones disponibles en la API de Cloud Vision

La detección facial es solo una de las muchas funciones disponibles en esta API. Admite las siguientes funciones adicionales:

  • detección de logotipos populares.
  • la capacidad de detectar todas las categorías aplicables a una imagen. Por ejemplo, una foto de un gato puede producir las categorías: gato, mamífero, vertebrado y persa.
  • Detectar puntos de referencia naturales y artificiales populares.
  • extraer texto de imágenes.
  • ejecutando Safe Search Detection para marcar imágenes que contengan contenido para adultos o violencia.

Configuración de Google Cloud Platform

El primer paso consiste en crear un nuevo proyecto en la consola de Google Cloud Platform.

Dirígete al tablero y crea un nuevo proyecto.

Una vez que haya creado su proyecto, tenga a mano el ID del proyecto.

Sigue estos pasos:

  • Una vez que tenga su proyecto, vaya a la página Crear clave de cuenta de servicio.
  • asegúrese de que su proyecto de detección facial esté seleccionado en la parte superior.
  • en "Cuenta de servicio " , seleccione "Nueva cuenta de servicio".
  • ingrese un nombre en el "Nombre de la cuenta de servicio".
  • en "Rol", seleccione "Proyecto"> "Propietario".
  • Finalmente, haga clic en "Crear" para que el archivo de credenciales JSON se descargue automáticamente.

Es posible que también deba habilitar la API de Cloud Vision a través de la sección Biblioteca de API.

Configuración del proyecto Laravel

El siguiente paso consiste en configurar un nuevo proyecto de Laravel. Si tiene un proyecto Laravel existente, puede omitir este paso.

Estoy usando Laravel 5.5 LTS para este artículo. En la línea de comando, ejecute el siguiente comando de Composer para crear un nuevo proyecto (también puede usar el instalador de Laravel):

composer create-project --prefer-dist laravel/laravel sample "5.5.*"

Si usó Composer, cambie el nombre del archivo .env.example a .env y luego ejecute el siguiente comando para configurar la clave de la aplicación:

php artisan key:generate

Agregue el paquete de visión en la nube de Google

Ejecute el siguiente comando para agregar el google/cloud-visionpaquete a su proyecto:

composer require google/cloud-vision

Puede colocar el archivo de credenciales JSON descargado en la raíz de su aplicación. No lo coloque en su directorio público. Siéntase libre de cambiarle el nombre. No envíe este archivo a su repositorio de código. Una opción es agregarlo al servidor manualmente.

Finalmente, ¡comencemos a codificar!

En primer lugar, asegúrese de tener la biblioteca GD instalada y activa. La mayoría de las plataformas tienen esto habilitado de forma predeterminada.

Agregaré la siguiente ruta a mi archivo "routes / web.php":

Route::get('/', '[email protected]');

Creé un controlador simple para albergar el código. Agregaré todo el código dentro del controlador. En una aplicación de producción, recomiendo encarecidamente utilizar clases de servicio independientes para cualquier lógica empresarial. De esta manera, los controladores son delgados y se adhieren a su intención original: controlar la entrada / salida.

Comenzaremos con un controlador simple, agregando una usedeclaración para incluir la ServiceBuilderclase de Google Cloud :


    
namespace App\Http\Controllers;
use Google\Cloud\Core\ServiceBuilder;
class SampleController extends Controller{ public function detectFaces() { // Code will be added here }}

The first thing we’ll do is create an instance of the ServiceBuilder class so we can specify our Project ID and JSON credentials.

$cloud = new ServiceBuilder([ 'keyFilePath' => base_path('fda.json'), 'projectId' => 'facial-detection-app' ]);

You specify the location of the JSON file using the keyFilePath key. I’ve used the Laravel base_path() helper to refer to the fully qualified app root path.

The next option is the projectId. This is the value you grabbed when you created the project in the GCP console.

Next, we’ll create an instance of the VisionClient class. The ServiceBuilder class makes it easy by exposing various factory methods which grant access to services in the API.

$vision = $cloud->vision();

Now that we have an instance of the class, we can start making use of the Vision API. We’ll be using the following image as the example. Feel free to download this image, name it “friends.jpg” and place it in your “public” folder.

We’ll first create a new image using the GD imagecreatefromjpeg() function. We’ll use the public_path() Laravel helper to refer to our image placed in the “public” folder.

$output = imagecreatefromjpeg(public_path('friends.jpg'));

Next, we’ll create a Cloud Vision Image object with this same image and specify that we want to run facial detection:

$image = $vision->image(file_get_contents(public_path('friends.jpg')), ['FACE_DETECTION']);

You’ll notice a slight change here. Instead of providing the path to the image, we’re supplying the actual image as a string using file_get_contents().

Then we run the annote() method on the image:

$results = $vision->annotate($image);

Now that we have the results, we simply need to loop through the found faces and draw boxes around the them using the vertices supplied in the result:

foreach ($results->faces() as $face) { $vertices = $face->boundingPoly()['vertices'];
 $x1 = $vertices[0]['x']; $y1 = $vertices[0]['y']; $x2 = $vertices[2]['x']; $y2 = $vertices[2]['y'];
 imagerectangle($output, $x1, $y1, $x2, $y2, 0x00ff00);}

Once this is done, we can output the image and destroy it to free up the memory:

header('Content-Type: image/jpeg'); imagejpeg($output); imagedestroy($output);

And this is the result:

Here is the final controller class code:


     
namespace App\Http\Controllers;
use Google\Cloud\Core\ServiceBuilder;
class SampleController extends Controller{ public function detectFaces() { $cloud = new ServiceBuilder([ 'keyFilePath' => base_path('fda.json'), 'projectId' => 'facial-detection-app' ]);
 $vision = $cloud->vision();
 $output = imagecreatefromjpeg(public_path('friends.jpg')); $image = $vision->image(file_get_contents(public_path('friends.jpg')), ['FACE_DETECTION']); $results = $vision->annotate($image);
 foreach ($results->faces() as $face) { $vertices = $face->boundingPoly()['vertices'];
 $x1 = $vertices[0]['x']; $y1 = $vertices[0]['y']; $x2 = $vertices[2]['x']; $y2 = $vertices[2]['y'];
 imagerectangle($output, $x1, $y1, $x2, $y2, 0x00ff00); }
 header('Content-Type: image/jpeg');
 imagejpeg($output); imagedestroy($output); }}

Additional functionality

In addition to grabbing the vertices, the response also includes a trove of useful information. This includes the locations of mouths, eyes, eyebrows, noses, etc. Simply print_r() the $face variable for a quick peek into the available data.

Another great feature is checking whether the detected face is happy, sad, angry, or surprised. You can even detect whether the face is blurry or underexposed, and whether they’re wearing headwear.

If you use this and end up doing something cool as a result, please let me know!

Upgrade your web dev skills!

Sign up to my newsletter where I’ll share insightful web development articles to supercharge your skills.

Originally published at www.chowles.com on July 6, 2018.