道可道

物聯(lián)網(wǎng)瀏覽器(IoTBrowser)-人臉快速搜索

起因

最近遇到一個(gè)人臉?biāo)阉鞯男枨螅A站的快遞被人誤領(lǐng)，拿走幾天還沒(méi)有送回來(lái)，所以想從出庫(kù)儀中找歷史出庫(kù)記錄的想法。

實(shí)現(xiàn)思路：

1.從雷現(xiàn)出庫(kù)儀上拷貝文件下來(lái)。(拷貝幾十萬(wàn)張人臉數(shù)據(jù)花了不少時(shí)間)

2.開發(fā)人臉?biāo)阉鞴ぞ?/span>

3.搜索比對(duì)（如果能找到歷史數(shù)據(jù)，就能找到人）

這里主要是開發(fā)人臉?biāo)阉鞴ぞ撸枰獙?shí)現(xiàn)識(shí)別圖片里面是否包含人臉、人臉匹配檢測(cè)等功能，網(wǎng)速找了一款工具，但是需要改造3點(diǎn)：

1.支持并發(fā)搜索，充分利用多核CPU，從幾十萬(wàn)張圖片中快速檢索到想要找的人。

2.支持參數(shù)配置，支持指定圖片和查找目錄、搜索第一張還是全部、找到后是否打開等參數(shù)。

3.開發(fā)UI配置界面，由于工具是控制臺(tái)應(yīng)用，使用起來(lái)不方便，所以需要一個(gè)UI界面。

屏幕錄制 2025-10-30 102642

使用IoTBrowser做為UI前端，使用少量的代碼既可實(shí)現(xiàn)。

屏幕錄制 2025-10-30 103845

核心代碼：

    <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="">清理歷史數(shù)據(jù)</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">停止服務(wù)</button>
                    </div>
                </div>
                <div class="am-form-group">
                    <textarea id="txtInfo" rows="40">{{msg}}</textarea>
                </div>

            </fieldset>
            
        </form>
    </div>
    <script>

        var hostid;// 主機(jī)id

        function startFace() {
            dds.iot.com.open({
                type: 'FaceCom',//人臉識(shí)別插件
                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);
            }
        }
        // 窗口初始化事件（操作窗口大小、標(biāo)題）
        $(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('請(qǐng)選擇原始文件')
                            return;
                        }
                        this.msg = ''
                        if (!config.FindDir) {
                            alert('請(qǐng)選擇查找目錄')
                            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>

系統(tǒng)支持：

1.人臉數(shù)量檢測(cè)、人臉匹配、人臉定位

2.多文件夾快速搜索，搜索一張還是全部

3.多線程并發(fā)搜索，快速查找人臉數(shù)據(jù)

使用簡(jiǎn)單的HTMl+WebAPI就可以實(shí)現(xiàn)人臉識(shí)別，將控制臺(tái)的輸出內(nèi)容通過(guò)WebSocket實(shí)時(shí)推送到前端界面。

posted on 2025-10-30 11:12 木子清閱讀(344) 評(píng)論(0) 收藏舉報(bào)

刷新頁(yè)面返回頂部

公告

導(dǎo)航

我的網(wǎng)站：道道工作室