vue 使用人脸识别_使用Vue.js和Kairos构建简单的人脸识别应用-CSDN博客

本文将指导你如何使用Vue.js和Kairos服务构建一个演示应用，用户可以上传面部图像进行识别。Kairos是一个提供面部检测和识别等功能的AI引擎。首先，你需要注册Kairos账户，然后设置Node服务器处理与Kairos API的交互。在前端，使用Vue.js创建用户界面，包括上传图片进行训练和识别的表单。完成这些步骤后，你将拥有一个简单的人脸识别应用。

摘要由CSDN通过智能技术生成

vue 使用人脸识别

Face Detection and Recognition have become an increasingly popular topic these days. It's a great advantage for a machine to know which user is in a picture. The applications of facial recognition in our world today are endless. From Face, iD unlock to identifying criminals on the run using real-time analysis of video feed.

近年来，人脸检测和识别已成为越来越受欢迎的话题。机器知道图片中的用户是一个很大的优势。面部识别在当今世界中的应用层出不穷。从Face，iD解锁到使用实时视频输入分析来识别犯罪分子。

我们将建立什么 ( What we'll build )

In this article, we'll build a demo app with Kairos service in which users can upload different images of labeled faces and also try to recognize a person from an uploaded face

在本文中，我们将使用Kairos服务构建一个演示应用，其中用户可以上传带有标签的面部的不同图像，还可以尝试从上传的面部中识别出一个人

什么是凯罗斯 ( What is Kairos )

Kairos is a leading AI engine provider which provides ‘Human Analytics' features like Face Detection, Face Identification, Face Verification, etc. More features here. These features can be used to gather unique, real-time insights about users as they interact with your product.

Kairos是领先的AI引擎提供商，提供诸如面部检测，面部识别，面部验证等“人类分析”功能。此处提供更多功能。这些功能可用于在用户与您的产品互动时收集有关用户的独特实时见解。

安装 ( Installation )

The front-end part of the application is built with a Progressive Javascript Framework Vue.js and a node server on the backend which handles the interaction with Kairos API.

该应用程序的前端部分由Progressive Javascript Framework Vue.js和后端的节点服务器构建，该节点服务器处理与Kairos API的交互。

依存关系 (Dependencies)

Before we begin, you need some things set up on your local machine

在开始之前，您需要在本地计算机上进行一些设置

Node installed
已安装节点
Node Package Manager (npm ) installed
安装了节点软件包管理器（ npm ）

Once you confirm your installation, you can continue.

确认安装后，即可继续。

步骤1：建立Kairos帐户 ( Step 1: Create a Kairos Account )

注册一个免费帐户。

After signing up, you'll be redirected to the dashboard with your credentials

注册后，将使用您的凭据将您重定向到仪表板

PS: Note your App ID and Key ( you'll need them later )

PS：记下您的App ID和Key （稍后将需要它们）

步骤2：设置节点服务器 ( Step 2: Set Up A Node Server )

Initialize your node project and create a package.json file with:

初始化您的节点项目，并使用以下命令创建一个package.json文件：

npm init

Install necessary node modules/dependencies :

安装必要的节点模块/依赖项：

npm install fs express connect-multiparty kairos-api cors body-parser --save

fs - we need this to convert our image into a base64 mode for attachment express - we need this to enable our API routes connect-multiparty - needed to parse HTTP requests with content-type multipart/form-data kairos-api - Node SDK for Kairos cors - we need this to enable cors body-parser - we need this to attach the request body on express req object

fs-我们需要此将图像转换为base64模式以进行附件表达-我们需要此功能以使我们的API路由connect-multiparty-解析具有内容类型multipart / form-data kairos-api的HTTP请求所需-Node SDK for Kairos cors-我们需要此功能以启用cors主体解析器-我们需要此功能将请求主体附加到express req对象上

Create an index.js file in your root directory and require the installed dependencies :

在您的根目录中创建一个index.js文件，并需要安装依赖项：

const fs = require('fs');
    const cors = require('cors');
    const express = require('express');
    const Kairos = require('kairos-api');
    const bodyParser = require('body-parser');
    const multipart = require('connect-multiparty');

    const app = express();
    app.use(cors());
    app.use(bodyParser.urlencoded({
     extended: false }));
    app.use(bodyParser.json());

    const multipartMiddleware = multipart();
    [...]

Next, configure your Kairos client in the index.js file:

接下来，在index.js文件中配置Kairos客户端：

// API Configurations for KAIROS
let kairo_client = new Kairos('APP_ID', 'APP_KEY');

Replace APP_ID and APP_KEY with the details from your dashboard

用仪表板中的详细信息替换APP_ID和APP_KEY

Add the route for uploading images to Kairos gallery. Let's call it /upload:

添加将图像上传到Kairos画廊的路线。我们称之为/upload ：

[...]
    app.post('/upload', multipartMiddleware, function(req, res)