Egret社区

【本文出自APICloud官方论坛,感谢鲍永道的分享。】


首先介绍下百度人脸识别模块(baiduFaceRec):
baiduFaceRec模块封装了百度AI人脸识别功能,使用此模块可实现百度人脸检测(包括age,beauty,expression,faceshape,gender,glasses,landmark,race,quality,facetype信息)、人脸对比功能(比对两张图片中人脸的相似度,并返回相似度分值)。**暂仅支持 android 平台。**

不啰嗦,直接上代码:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/html">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta name="viewport"
          content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <title>frame2</title>
    <link rel="stylesheet" href="../css/api.css">
    <link rel="stylesheet" href="../css/aui.css">
    <style>
        html, body {
            background: #ffffff;
        }

        .my-card {
            border: solid 1px #dddddd;
            margin: 10px;
        }

        .aui-btn-block {
            margin-bottom: 10px;
        }
    </style>
</head>
<body>
<section class="aui-content-padded my-card">
    <div class="aui-card-list">
        <div class="aui-card-list-header">
            百度人脸识别(V3版本)自定义模块
        </div>
        <div class="aui-card-list-content-padded">
            人脸识别
        </div>
        <div class="aui-card-list-footer">
            2018-06-03
        </div>
    </div>
</section>
<div class="aui-content-padded">
    <p>
    <div class="aui-btn aui-btn-info aui-btn-block">获取access_token</div>
    </p>
    <p>
    <div class="aui-btn aui-btn-info aui-btn-block">人脸检测</div>
    </p>
    <p>
    <div class="aui-btn aui-btn-info aui-btn-block">人脸对比</div>
    </p>
</div>
</body>
</html>
<script src="../script/api.js"></script>
<script>
    var baiduFaceRec = null;
    var UIAlbumBrowser = null;

    apiready = function () {
        baiduFaceRec = api.require('baiduFaceRec');
        UIAlbumBrowser = api.require('UIAlbumBrowser');
    };

    //获取access_token
    function getAuth() {
        var params = {
            ak: 'your ak',
            sk: 'your sk'
        };
baiduFaceRec.getAuth(params, function (ret, err) {
    if (ret) {
        console.log(JSON.stringify(ret));
        alert('access_token=' + ret.access_token);
    } else {
        console.log(err.msg);
        alert('错误信息:' + err.msg);
    }
})
    }

    //人脸检测
    function detect() {
        //先获取access_token
        var params = {
            ak: 'your ak',
            sk: 'your sk'
        };
        baiduFaceRec.getAuth(params, function (ret, err) {
            if (ret) {
                console.log(JSON.stringify(ret));
                var access_token = ret.access_token;
                //选择照片或拍照
                api.actionSheet({
                    title: '选择照片',
                    cancelTitle: '取消',
                    buttons: ['拍照', '手机相册']
                }, function (ret, err) {
                    if (ret) {
                        console.log(ret.buttonIndex);
                        if (ret.buttonIndex != 3) {
                            var sourceType = ret.buttonIndex;
                            //获取图片
                            api.getPicture({
                                sourceType: (sourceType == 1) ? 'camera' : 'album',
                                encodingType: 'jpg',
                                mediaValue: 'pic',
                                destinationType: 'url',
                                allowEdit: true,
                                saveToPhotoAlbum: false
                            }, function (ret, err) {
                                if (ret) {
                                    console.log(ret.data);
                                    var filePath = ret.data;
                                    var params = {
                                        filePath: filePath,
                                        access_token: access_token
                                    };
                                    //人脸检测
                                    baiduFaceRec.detect(params, function (ret, err) {
                                        if (ret) {
                                            console.log(JSON.stringify(ret));
                                            alert('人脸检测数据' + JSON.stringify(ret.result.face_list));
                                        } else {
                                            console.log(err.msg);
                                        }
                                    })
                                } else {
                                    console.log(JSON.stringify(err));
                                    alert(JSON.stringify(err));
                                }
                            })
                        } else {
                            return false;
                        }
                    }
                });
            } else {
                console.log(err.msg);
                alert('错误:' + ret.msg);
            }
        });
    }

    //人脸对比
    function match() {
        //先获取access_token
        var params = {
            ak: 'your ak',
            sk: 'your sk'
        };
        baiduFaceRec.getAuth(params, function (ret, err) {
            if (ret) {
                console.log(JSON.stringify(ret));
                var access_token = ret.access_token;
                //得到对比图片
                UIAlbumBrowser.open({
                    max: 2,
                    styles: {
                        bg: '#fff',
                        mark: {
                            icon: '',
                            position: 'bottom_left',
                            size: 20
                        },
                        nav: {
                            bg: 'rgba(0,0,0,0.6)',
                            titleColor: '#fff',
                            titleSize: 18,
                            cancelColor: '#fff',
                            cancelSize: 16,
                            finishColor: '#fff',
                            finishSize: 16
                        }
                    },
                    rotation: true
                }, function (ret) {
                    if (ret) {
                        var filePath1 = ret.list[0].path;
                        var filePath2 = ret.list[1].path;
                        var params = {
                            filePath1: filePath1,
                            filePath2: filePath2,
                            access_token: access_token
                        };
                        //人脸对比
                        baiduFaceRec.match(params, function (ret, err) {
                            if (ret) {
                                console.log(JSON.stringify(ret));
                                alert('人脸检测数据' + JSON.stringify(ret));
                            } else {
                                console.log(err.msg);
                            }
                        })
                    }
                });
            } else {
                console.log(err.msg);
                alert('错误:' + ret.msg);
            }
        });
    }
</script>
使用模块前需要先到百度AI开发者中心创建应用,获取ak和sk,然后进行身份验证,获取返回的access_token,建议每次进行人脸识别接口时先获取access_token(30期限),然后每次请求识别接口也传入access_token,这样保证每次都请求ok。

另外的两个人脸识别接口,一个是人脸识别,一个是人脸对比。

人脸识别主要是识别人的脸部相关参数,对应的参数很多,我就不一一说明了,文档有详细说明。另外就是人脸对比,对比两张脸的相似度值,可以根据相似度值来判断两张人脸是否是同一个人,在项目上应用于人脸对比验证,应该会使用的比较多。

分享到 :
0 人收藏

1 个回复

倒序浏览
jxhgzs  登堂入室 | 2019-4-5 18:01:30
<link rel="stylesheet" href="../css/api.css">
    <link rel="stylesheet" href="../css/aui.css">
<script src="../script/api.js"></script>

这几个文件缺少,我从百度开发者中心看了下 提供的sdk中并没有类似 api.js 这样的方式,都是 java nodejs python等语言的,我想知道你怎么在网页中使用的 求指点!
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

小黑屋|京网文[2014]0791-191号|京ICP证150115号|Egret社区 ( 京ICP备14025619号 )

Powered by Discuz! X3.4 © 2001-2019 Comsenz Inc.

返回顶部