物联网浏览器(IoTBrowser)-人脸快速搜索

起因

最近遇到一个人脸搜索的需求，驿站的快递被人误领，拿走几天还没有送回来，所以想从出库仪中找历史出库记录的想法。

实现思路：

1.从雷现出库仪上拷贝文件下来。(拷贝几十万张人脸数据花了不少时间)

2.开发人脸搜索工具

3.搜索比对（如果能找到历史数据，就能找到人）

这里主要是开发人脸搜索工具，需要实现识别图片里面是否包含人脸、人脸匹配检测等功能，网速找了一款工具，但是需要改造3点：

1.支持并发搜索，充分利用多核CPU，从几十万张图片中快速检索到想要找的人。

2.支持参数配置，支持指定图片和查找目录、搜索第一张还是全部、找到后是否打开等参数。

3.开发UI配置界面，由于工具是控制台应用，使用起来不方便，所以需要一个UI界面。

使用IoTBrowser做为UI前端，使用少量的代码既可实现。

 

核心代码：

    <div id="vue_root" class="fun_bd" style="padding:10px;">         <form class="am-form">             <fieldset>                 <div class="am-form-group">                     <label for="doc-ipt-email-1" class="am-u-sm-1">原始文件</label>                     <div class="am-u-sm-3">                         <input  type="text" v-model="config.ImagePath" style="width: 75%;display: inline;" />                         <input type="button" @click="selectFile()" value="选择" />                     </div>                     <label for="doc-ipt-email-1" class="am-u-sm-1">查找目录</label>                     <div class="am-u-sm-3">                         <input type="text" v-model="config.FindDir" style="width: 75%;display: inline;" />                         <input type="button" value="选择" @click="selectSaveDir()" />                     </div>                     <label for="doc-ipt-email-1" class="am-u-sm-1">历史文件</label>                     <div class="am-u-sm-3">                         <input type="text" v-model="config.HistoryFileName" style="width: 75%;display: inline;" />                     </div>                 </div>                 <div class="am-form-group">                     <div class="am-u-sm-3">                         <input id="ClearHistory" type="checkbox" v-model="config.ClearHistory" />                         <label for="ClearHistory" class="">清理历史数据</label>                     </div>                     <div class="am-u-sm-3">                         <input id="FindFirstStop" type="checkbox" v-model="config.FindFirstStop" />                         <label for="FindFirstStop" class="">找到第一张停止</label>                     </div>                     <div class="am-u-sm-3">                         <input id="FindOpen" type="checkbox" v-model="config.FindOpen" />                         <label for="FindOpen" class="">找到后立即打开</label>                     </div>                     <div class="am-u-sm-3">                          <!--<button onclick="startFace()" class="am-btn-primary" type="button">打开连接</button>-->                         <button @click="find()" v-if="!isFind" class="am-btn-primary" type="button">开始查询</button>                         <button @click="stop()" v-if="isFind" class="am-btn-primary" type="button">停止服务</button>                     </div>                 </div>                 <div class="am-form-group">                     <textarea id="txtInfo" rows="40">{{msg}}</textarea>                 </div>              </fieldset>                      </form>     </div>     <script>          var hostid;// 主机id          function startFace() {             dds.iot.com.open({                 type: 'FaceCom',//人脸识别插件                 port: 1,                 baudRate: 1,                 onReceive: function (res) {                     if ($vue.isFind) {                          if (res.data.indexOf('已找到：') == 0) {                             alert(res.data)                         }                         addMsg(res.data)                     }                     //console.log('host', res.data)                 },                 onOpen: function (ar) {                     if (ar.Success) {                         hostid = ar.Data;                         addMsg('连接成功！')                     } else {                         alert(ar.Message)                     }                 }             })         }          var $msg;         function addMsg(msg) {             var m = $vue.msg + "n" + msg;             if ($vue.msg.length > 10000) {                 $vue.msg = (msg);             } else {                 $vue.msg = (m);             }         }         // 窗口初始化事件（操作窗口大小、标题）         $(document).bind('dds.window.init', function (e, win) {             $msg = $('#txtInfo')             startFace();             initVue();         })         var $vue;         function initVue() {              $vue = new Vue({                 el: '#vue_root',                 data: {                     advanceSetting: false,                     msg: "",                     isFind:false,                     config: {                         ImagePath: "",                         FindDir: "D:\image",                         HistoryFileName: "",                         ClearHistory: true,                         FindOpen: true,                         FindFirstStop: true,                     },                 },                 mounted() {                     if (localStorage._faceConfig) {                         this.config=JSON.parse(localStorage._faceConfig);                     }                 },                 methods: {                     selectFile() {                         this.config.ImagePath = _host.selectFile();                     },                     find() {                         var config = this.config                         if (!config.ImagePath) {                             alert('请选择原始文件')                             return;                         }                         this.msg = ''                         if (!config.FindDir) {                             alert('请选择查找目录')                             return;                         }                         this.isFind = true;                         dds.iot.com.exeCommand({ id: hostid, name: "Find", data: { timeout1: 30000, config } }, function (ar) {                             if (ar.Success) {                             } else {                                 addMsg('操作失败：' + ar.Message)                             }                         })                         localStorage._faceConfig = JSON.stringify(config);                     },                     stop() {                         this.isFind = false;                         dds.iot.com.exeCommand({ id: hostid, name: "Stop", data: { } }, function (ar) {                             if (ar.Success) {                             } else {                                 addMsg('操作失败：' + ar.Message)                             }                         })                     },                      clearLog() {                         this.msg=''                     },selectSaveDir() {                          var dir = dds.file.openFolderDialog();                          this.config.FindDir=(dir)                     }                 }             })         }     </script> 

　　

系统支持：

1.人脸数量检测、人脸匹配、人脸定位

2.多文件夹快速搜索，搜索一张还是全部

3.多线程并发搜索，快速查找人脸数据

 

使用简单的HTMl+WebAPI就可以实现人脸识别，将控制台的输出内容通过WebSocket实时推送到前端界面。