uniapp+vue3+ts+百度人脸检测

百度人脸检测:https://console.bce.baidu.com/ai/?fromai=1#/ai/face/overview/index

免费资源包用完需要付费。

1、百度开通人脸检测

创建应用:https://console.bce.baidu.com/ai/?fromai=1#/ai/face/app/list

新建组->新建用户

实名认证->领取“人脸检测”资源:https://console.bce.baidu.com/ai/#/ai/face/overview/resource/getFree

2、uni
微信小程序:uni.createCameraContext()

0、展示

<up-modal :show="show"  title="人脸检测" @confirm="close()"><view class="slot-content"><!-- "front"表示使用前置摄像头、"back"表示使用后置摄像头,高度不能太小 --><camera device-position="front" flash="off" style="width: 300px; height: 300px;border-radius: 50%;"></camera>
</view>
</up-modal>// 使用 reactive 创建响应式状态
const state = reactive({baiduApiData: {apikey: '', // 创建应用时生成SecretKey: '' // 创建应用时生成},access_token: '',base64Img: '',// 检测到人脸的照片baseImage: ''
});// 弹窗
const show = ref(false); 
const close = () => {show.value = false
}
const show_camera = () => {show.value = true// 初始化相机之后再调用,不然报错setTimeout(() => {to_camera()}, 1000);
}

1、拍照
2、图片 base64编码

const to_camera = () => {uni.showLoading({title: '加载中'});const cameraContext = uni.createCameraContext();cameraContext.takePhoto({quality: 'high',success: (res) => {console.log("cameraContext", res.tempImagePath)wx.getFileSystemManager().readFile({filePath: res.tempImagePath, //选择图片返回的相对路径encoding: 'base64', //编码格式success: (res) => { //成功的回调state.base64Img = res.dataconsole.log("getFileSystemManager", res)getAccessToken()}})},fail: (err) => {uni.hideLoading();console.log("to_camera02", err)}});
}

3、百度人脸检测获取token

const getAccessToken = () => {// 每次更新access_tokenlet baiduApiData = state.baiduApiData;uni.request({url: "https://aip.baidubce.com/oauth/2.0/token?grant_type=client_credentials&client_id="+baiduApiData.apikey+"&client_secret="+baiduApiData.SecretKey,method: 'POST',dataType: "json",header: {'content-type': 'application/json'},success: function(res) {state.access_token = res.data.access_token;console.log("getAccessToken", res.data.access_token)//获取到token后开始检测人像setTimeout(()=>{initBaiDuApiFunction()},1000)},fail(err) {uni.hideLoading();console.log(err)}})
}

4、检测人脸数据(传base64图片)

const initBaiDuApiFunction = () => {uni.request({url: "https://aip.baidubce.com/rest/2.0/face/v3/detect?access_token=" + state.access_token,data: {//具体参数请自动查看apiimage: state.base64Img,image_type: "BASE64",max_face_num: 1,face_field: 'quality',},method: 'POST',dataType: "json",header: {'content-type': 'application/json'},success: function(res) {console.log(res)if (res.data.error_code === 0) { //检测到人脸就开启拍照let faceList = res.data.result.face_list[0];let face_probability = faceList.face_probability > 0.6; //人脸置信度let quality = faceList.quality; //人脸质量let blur = quality.blur < 0.5; //人脸模糊度 0-1 0清晰 1模糊// let illumination = quality.illumination > 100; //脸部光照度 暂时不用// left_eye : 0.6, #左眼被遮挡的阈值// right_eye : 0.6, #右眼被遮挡的阈值// nose : 0.7, #鼻子被遮挡的阈值// mouth : 0.7, #嘴巴被遮挡的阈值// left_cheek : 0.8, #左脸颊被遮挡的阈值// right_cheek : 0.8, #右脸颊被遮挡的阈值// chin_contour : 0.6, #下巴被遮挡阈值let  occlusion =quality.occlusion;//遮挡情况let location = faceList.location;//头像位置信息let top = location.top;let left = location.left;let completeness = quality.completeness == 1; //人脸完整度if (face_probability && blur && completeness) {//获取人脸较为清晰可以开始身份检测state.baseImage = 'data:image/png;base64,'+ state.base64Img//获取到的图片base64uni.showToast({title:"人脸检测成功!"})show.value = falseuni.hideLoading();}else{uni.showToast({title:"检测失败!"})//否则重新开始拍照setTimeout(()=>{to_camera()},1000)}} else {//没有检测到人脸也重新开始拍照setTimeout(()=>{to_camera()},1000)}},fail(err) {uni.hideLoading();console.log(err)}})
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/diannao/22315.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Vue 的响应式系统原理

Vue 的响应式系统是其核心功能之一,它允许数据模型发生变化时自动更新视图。这个机制使得 Vue 能够高效地跟踪依赖关系,并在数据发生变化时仅更新必要的部分,而不是全局重新渲染。 Vue 的响应式系统原理主要包括以下几个方面: 1&#xff1a;数据观测: Vue 使用 Object.define…

JS百题斩~秒懂数据的作用域(超详细)

数据的作用域 定义&#xff1a;作用域是运行时代码中的变量&#xff0c;函数和对象的可访问性。通俗的意思就是数据在哪个范围是有效可用的&#xff0c;出了这个范围就不能用了。 作用域在哪&#xff0c;关键看在哪里定义的。 ES6之前没有块级作用域。 1.JS有两种作用域&…

解决linux系统求前N月月份的bug

日常工作中&#xff0c;需要获取某个日期&#xff08;20240531&#xff09;的前N个月&#xff0c;通常会写命令 date -d "20240531 last-month" %Y%m 我期望得到202404 但是很意外&#xff1a; 经过几轮测试&#xff0c;发现只要月内天数超过30天&#xff0c;即所有…

短视频动画脚本:成都鼎茂宏升文化传媒公司

短视频动画脚本&#xff1a;创作与魅力的探索 在数字化时代的浪潮中&#xff0c;短视频动画以其独特的魅力迅速崛起&#xff0c;成为大众娱乐和信息传播的重要载体。成都鼎茂宏升文化传媒公司作为一名原创文章编辑&#xff0c;我深入探索了短视频动画脚本的创作过程&#xff0…

二,几何相交-5,BO算法分析--(1)正确性

也就是说&#xff0c;BO算法有没有可能误报或者漏报&#xff1f; 一&#xff0c;为什么不会误报&#xff1f; 因为两条线段从不相邻到相邻&#xff0c;或者其中一条线段不存在到相邻&#xff0c;都会进行一次相交测试。所以不会误报。 二&#xff0c;为什么不会漏报&#xff1…

学习算法笔记(7.5)-贪心算法(股票售卖问题)

学到这里的大家应该都非常清楚贪心算法到底是怎么一回事了&#xff0c;说白了就是动态规划的一种特例&#xff0c;没有动态规划的使用范围广&#xff0c;但是效率却比动态规划效率高&#xff0c;贪心算法不考虑之前的情况&#xff0c;只考虑当前的最优选择以期达到最优的结果。…

五款效率软件助你事半功倍

1、&#x1f517; 亿可达 作为一款自动化工具&#xff0c;亿可达被誉为国内版的免费Zaiper。它允许用户无需编程知识即可将不同软件连接起来&#xff0c;构建自动化的工作流程。其界面设计清新且直观&#xff0c;描述语言简洁易懂&#xff0c;使得用户可以轻松上手。 2、&…

轻松产出创新点!多元时间序列最新可参考成果,高性能高精度

今天给大家推荐一个好挖创新点的研究方向&#xff1a;多元时间序列。 多元时间序列是我们解决复杂系统分析和预测问题的重要工具。它通过综合分析多个相关时序数据&#xff0c;可以给我们提供更精准的预测结果&#xff0c;非常适合处理涉及多个变量和多个时间点数据的场景&…

基于 GhostNet 不同版本的图像识别

1、介绍 GhostNet 文章地址&#xff1a;[1911.11907] GhostNet: More Features from Cheap Operations (arxiv.org) 主要思想&#xff1a; 特征提取的时候&#xff0c;很多特征图是具有高度相似性的&#xff0c;也就是说存在许多的冗余特征图。 从另一个角度想&#xff0c;…

从零开始实现自己的串口调试助手(5) -实现HEX显示/发送/接收

实现HEX显示: HEX 显示 -- 其实就是 十六进制显示 --> a - 97(10) --> 61(16) 添加槽函数(bool): 实现槽函数: 注意: 注意QString 没有处理HEX显示的相关API 需要使用 toUtf-8 来 转换位QByteArry 类型&#xff0c; 利用其中的API 来处理HEX格式(toHex fromHex) vo…

【做一道算一道】字节实习笔试(A出来的两道)

快乐氛围 题意大概是派对上每个人的氛围值不同&#xff0c;值高的跟值低的打招呼&#xff0c;总氛围会产生变化&#xff0c;值相同的打招呼不产生变化&#xff0c;求整体派对的氛围值。 氛围值变化公式高值-低值 示例 输入&#xff1a; 3 2 4 0 输出&#xff1a; 8 意为&…

Kubernetes外部服务管理Ingress介绍

前言 在 Kubernetes 集群中&#xff0c;管理外部服务的访问和流量路由至关重要。通过使用 Ingress 控制器&#xff0c;我们能够实现对外部服务的有效管理&#xff0c;配置灵活的路由规则&#xff0c;并实现负载均衡和流量控制。 目录 一、Ingress 介绍 1. Ingress 概述 2.…

【求助】ansible synchronize 问题

求助贴&#xff0c;不是解答贴哈 最近把一台服务器从centos7.9升级到alibaba cloud linux3之后&#xff0c;出现了一个ansible的问题。 版本是ansible8.3.0ansible-core-2.15.3&#xff0c;在使用synchronize模块时&#xff0c;我使用了别名&#xff08;比如web1&#xff09;会…

Windows下搭建Cmake编译环境进行C/C++文件的编译

文章目录 1.下载Cmake2.安装MinGW-w643.进行C/C文件的编译 1.下载Cmake 网址&#xff1a;https://cmake.org/download/ 下载完成后安装&#xff0c;勾选“Add CMake to the system PATH for the current user" 点击Finish完成安装&#xff0c;在cmd窗口验证一下是否安…

C++并发之线程(std::thread)

目录 1 概述2 使用实例3 接口使用3.1 construct3.2 assigns3.3 get_id3.4 joinable3.5 join3.6 detach3.7 swap3.8 hardware_concurrency 1 概述 Thread类来表示执行的各个线程。   执行线程是指可以在多线程环境中与其他此类序列同时执行的指令序列&#xff0c;同时共享相同…

python使用pandas的常用操作

文章目录 安装导入主要数据结构常用方法和操作创建数据结构读取和写入数据数据选择和过滤数据操作基本统计分析分组和聚合合并和连接重塑数据1. pivot 和 pivot_table2. melt3. stack和 unstack 常用方法总结pandas操作excel安装相关库 读取单个工作表读取指定工作表读取多个工…

短视频矩阵系统源码---开发BS架构B/S(Browser/Server Architecture)架构

短视频矩阵系统源头开发------- 第一款叫做筷子科技&#xff0c;这个筷子科技剪辑和发布都是没有问题的&#xff0c;但是前一段时间他的剪辑发个公告&#xff0c;每个账号只能发两条&#xff0c;另外它的唯一缺点就是它成本比较高的&#xff0c;入门门槛应该在12800左右&#…

CHATGPT升级plus(已有账号前提下)

注册wildcard(虚拟卡) 注册号账号后先进行充值&#xff0c;充值后选择CHATGPT一键升级按照他的流程来即可 Wildcard网址&#xff1a;Wildcard跳转注册 填写邀请码充值时少两美金合计14&#xffe5; 邀请码&#xff1a;OL3QXTRH

【2022-2011年】地级市数字经济指数原始数据+测算dofile+结果

参照赵涛等&#xff08;2020&#xff09;的文章&#xff0c;利用熵值法对城市数字经济指数进行测算&#xff0c;包括原始数据、线性插值、回归填补3种版本下测算的数字经济指数。保留原始数据、stata代码和测算结果&#xff0c;大家可进行复现 一、数据介绍 数据名称&#x…