<h2>工具简介</h2>
<p><strong>AI 人脸检测与关键点</strong>是工具派推出的一款基于 MediaPipe Face Landmarker 的浏览器端 AI 视觉工具：只要上传一张包含人脸的照片，它就能在浏览器本地自动检测出画面中的所有人脸，并为每张人脸定位 <strong>478 个关键点</strong>，把特征点与连线网格实时绘制在结果图上。检测完成后，你可以一键下载带绿色关键点网格的标注图，也可以导出每张人脸关键点的归一化坐标 JSON 数据，方便做人脸分析、姿态估计、AR 贴纸等二次开发。整个过程在浏览器本地完成，照片不会上传到服务器，打开即用、无需安装。</p>
<h2>功能亮点</h2>
<ul>
<li><strong>478 个高精度关键点</strong>：基于 MediaPipe Face Landmarker 模型，每张人脸输出 478 个特征点，覆盖眉毛、眼睛、鼻子、嘴唇轮廓与面部轮廓，并自动绘制关键点连线网格。</li>
<li><strong>多人脸同时检测</strong>：合影、集体照中的每张人脸都会被逐一检测并独立绘制网格，检测结果卡片会明确报告「检测到 N 张人脸，每张 478 个关键点」。</li>
<li><strong>纯浏览器本地运行</strong>：模型在本地加载和推理，照片全程不离开你的设备，隐私安全有保障，也无需等待服务器排队。</li>
<li><strong>原图 / 结果对比展示</strong>：检测完成后页面以双栏形式并排展示「原图」和「关键点结果」，绿色网格叠加效果一目了然。</li>
<li><strong>两种结果下载方式</strong>：「下载标注图」保存带关键点网格的 PNG 图片；「下载 JSON」导出每张人脸 478 个点的 x、y、z 归一化坐标，便于程序化使用。</li>
<li><strong>模型加载进度可见</strong>：首次使用时页面显示「模型加载中 X%」进度条，模型缓存后再次检测几乎即点即出。</li>
<li><strong>零门槛免安装</strong>：无需注册即可体验，不装插件、不配环境，打开网页就能用。</li>
</ul>
<h2>参数说明</h2>
<table>
<thead>
<tr>
<th>参数</th>
<th>说明</th>
<th>默认值 / 取值范围</th>
</tr>
</thead>
<tbody><tr>
<td>上传图片</td>
<td>点击「选择文件」上传待检测的人脸照片，是检测的唯一输入</td>
<td>支持 JPG / PNG / WEBP，单文件最大 10MB，必选</td>
</tr>
<tr>
<td>开始检测</td>
<td>触发人脸检测的按钮；未上传图片时按钮禁用</td>
<td>按钮文案：开始检测 / 检测中...</td>
</tr>
<tr>
<td>模型加载进度条</td>
<td>首次检测时下载并初始化 MediaPipe 模型，实时显示百分比</td>
<td>仅首次出现，0–100%</td>
</tr>
<tr>
<td>检测结果</td>
<td>检测完成后展示人脸数量与每张人脸的关键点数量</td>
<td>文案：检测到 N 张人脸，每张 478 个关键点</td>
</tr>
<tr>
<td>下载标注图</td>
<td>把叠加了绿色关键点网格的结果图保存为 PNG</td>
<td>文件名 <code>face_landmarks_时间戳.png</code></td>
</tr>
<tr>
<td>下载 JSON</td>
<td>导出每张人脸的关键点坐标数组，含 faceIndex、pointCount 与 points（x、y、z）</td>
<td>文件名 <code>face_landmarks_时间戳.json</code>，坐标为 0–1 归一化值</td>
</tr>
</tbody></table>
<h2>使用步骤</h2>
<ol>
<li><strong>打开工具页面</strong>：顶部是工具标题与功能简介，中间的「上传图片」卡片是主要操作区，包含文件选择按钮和蓝色的「开始检测」按钮；无需安装任何软件，浏览器打开即用。</li>
</ol>
<p><img src="article/202607/1783999858798_2612.png" alt="AI 人脸检测与关键点工具主界面：顶部白色卡片展示工具标题与「使用 MediaPipe 在浏览器本地定位 478 个人脸"></p>
<ol start="2">
<li><p><strong>上传图片</strong>：点击「选择文件」，选择一张包含人脸的照片，支持 JPG / PNG / WEBP，大小不能超过 10MB；选择成功后页面下方会出现「原图」预览。</p>
</li>
<li><p><strong>开始检测</strong>：点击蓝色「开始检测」按钮。首次使用需要先加载 MediaPipe 模型，页面会显示「模型加载中 X%」的进度条，模型就绪后自动开始推理，按钮变为「检测中...」。</p>
</li>
<li><p><strong>查看检测结果</strong>：检测完成后，结果区以双栏并排展示「原图」与「关键点结果」，人脸位置叠加了绿色的关键点与连线网格；下方「检测结果」卡片会显示检测到的人脸数量。若画面中没有可识别的人脸，会提示「未检测到人脸，请尝试其他图片」。</p>
</li>
<li><p><strong>下载结果</strong>：在「检测结果」卡片中，点击「下载标注图」可保存带关键点网格的 PNG 图片；点击「下载 JSON」则导出每张人脸 478 个关键点的归一化坐标（x、y、z，取值 0–1），可用于二次开发。</p>
</li>
</ol>
<h2>使用技巧</h2>
<ul>
<li><strong>首次加载请耐心等待</strong>：模型文件较大，第一次点击检测需要下载并初始化 MediaPipe 模型，进度条走完即可；之后模型会缓存在浏览器中，再次使用速度明显加快。</li>
<li><strong>清晰正脸效果最好</strong>：面部无遮挡、光线充足、分辨率适中的照片关键点定位最准；过度模糊、大角度侧脸、戴口罩或墨镜的照片可能漏检或定位偏移。</li>
<li><strong>合影可以一次检完</strong>：多人合照无需裁剪，工具会自动遍历画面中的所有人脸并分别绘制网格，检测结果卡片会报告人脸总数。</li>
<li><strong>超限图片先压缩</strong>：超过 10MB 会提示「图片大小不能超过 10MB」，可先用工具派的图片压缩工具处理后再上传。</li>
<li><strong>JSON 坐标记得换算</strong>：导出的 x、y 是相对图片宽高的 0–1 比例值，乘以图片实际像素宽高即可还原像素坐标；z 为相对深度，同样做了归一化。</li>
<li><strong>隐私敏感场景放心用</strong>：整个检测在浏览器本地完成，照片不会经过网络传输，适合处理不便外传的证件照、生活照。</li>
</ul>
<h2>常见问题</h2>
<p><strong>Q1：478 个关键点是什么？</strong><br>MediaPipe Face Landmarker 模型为每张人脸输出 478 个特征点，分布在眉毛、眼睛、鼻子、嘴唇轮廓和面部外轮廓上。工具会把这些点以及点之间的连线（网格）绘制在结果图上，形成常见的「人脸网格」效果。</p>
<p><strong>Q2：我的照片会上传到服务器吗？</strong><br>不会。模型在浏览器本地加载和运行，图片始终留在你的设备上，整个检测过程不经过网络传输，隐私有充分保障。</p>
<p><strong>Q3：支持同时检测多个人脸吗？</strong><br>支持。合影中每张人脸都会被独立检测并绘制各自的关键点网格，「检测结果」卡片会显示检测到的人脸总数；下载的 JSON 中每张人脸用 <code>faceIndex</code> 字段区分。</p>
<p><strong>Q4：为什么提示「未检测到人脸，请尝试其他图片」？</strong><br>常见原因包括人脸在画面中占比太小、照片过度模糊、大角度侧脸、面部被手或物品遮挡、光线太暗等。换一张清晰、正脸、面部占比适中的照片再试即可。</p>
<p><strong>Q5：支持哪些图片格式？有大小限制吗？</strong><br>支持 JPG、PNG、WEBP 等浏览器可解析的常见图片格式，单个文件最大 10MB。超过限制会提示「图片大小不能超过 10MB」，需要先压缩再上传。</p>
<p><strong>Q6：下载的 JSON 里 x、y、z 分别代表什么？</strong><br>x、y 是关键点相对于图片宽、高的归一化坐标（取值 0–1），乘以图片实际宽高即可得到像素位置；z 表示该点相对于面部平面的深度信息，同样经过归一化，可用于三维面部分析与 AR 应用。</p>


## 工具简介

**AI 人脸检测与关键点**是工具派推出的一款基于 MediaPipe Face Landmarker 的浏览器端 AI 视觉工具：只要上传一张包含人脸的照片，它就能在浏览器本地自动检测出画面中的所有人脸，并为每张人脸定位 **478 个关键点**，把特征点与连线网格实时绘制在结果图上。检测完成后，你可以一键下载带绿色关键点网格的标注图，也可以导出每张人脸关键点的归一化坐标 JSON 数据，方便做人脸分析、姿态估计、AR 贴纸等二次开发。整个过程在浏览器本地完成，照片不会上传到服务器，打开即用、无需安装。

## 功能亮点

- **478 个高精度关键点**：基于 MediaPipe Face Landmarker 模型，每张人脸输出 478 个特征点，覆盖眉毛、眼睛、鼻子、嘴唇轮廓与面部轮廓，并自动绘制关键点连线网格。
- **多人脸同时检测**：合影、集体照中的每张人脸都会被逐一检测并独立绘制网格，检测结果卡片会明确报告「检测到 N 张人脸，每张 478 个关键点」。
- **纯浏览器本地运行**：模型在本地加载和推理，照片全程不离开你的设备，隐私安全有保障，也无需等待服务器排队。
- **原图 / 结果对比展示**：检测完成后页面以双栏形式并排展示「原图」和「关键点结果」，绿色网格叠加效果一目了然。
- **两种结果下载方式**：「下载标注图」保存带关键点网格的 PNG 图片；「下载 JSON」导出每张人脸 478 个点的 x、y、z 归一化坐标，便于程序化使用。
- **模型加载进度可见**：首次使用时页面显示「模型加载中 X%」进度条，模型缓存后再次检测几乎即点即出。
- **零门槛免安装**：无需注册即可体验，不装插件、不配环境，打开网页就能用。

## 参数说明

| 参数 | 说明 | 默认值 / 取值范围 |
| --- | --- | --- |
| 上传图片 | 点击「选择文件」上传待检测的人脸照片，是检测的唯一输入 | 支持 JPG / PNG / WEBP，单文件最大 10MB，必选 |
| 开始检测 | 触发人脸检测的按钮；未上传图片时按钮禁用 | 按钮文案：开始检测 / 检测中... |
| 模型加载进度条 | 首次检测时下载并初始化 MediaPipe 模型，实时显示百分比 | 仅首次出现，0–100% |
| 检测结果 | 检测完成后展示人脸数量与每张人脸的关键点数量 | 文案：检测到 N 张人脸，每张 478 个关键点 |
| 下载标注图 | 把叠加了绿色关键点网格的结果图保存为 PNG | 文件名 `face_landmarks_时间戳.png` |
| 下载 JSON | 导出每张人脸的关键点坐标数组，含 faceIndex、pointCount 与 points（x、y、z） | 文件名 `face_landmarks_时间戳.json`，坐标为 0–1 归一化值 |

## 使用步骤

1. **打开工具页面**：顶部是工具标题与功能简介，中间的「上传图片」卡片是主要操作区，包含文件选择按钮和蓝色的「开始检测」按钮；无需安装任何软件，浏览器打开即用。

![AI 人脸检测与关键点工具主界面：顶部白色卡片展示工具标题与「使用 MediaPipe 在浏览器本地定位 478 个人脸](article/202607/1783999858798_2612.png)

2. **上传图片**：点击「选择文件」，选择一张包含人脸的照片，支持 JPG / PNG / WEBP，大小不能超过 10MB；选择成功后页面下方会出现「原图」预览。

3. **开始检测**：点击蓝色「开始检测」按钮。首次使用需要先加载 MediaPipe 模型，页面会显示「模型加载中 X%」的进度条，模型就绪后自动开始推理，按钮变为「检测中...」。

4. **查看检测结果**：检测完成后，结果区以双栏并排展示「原图」与「关键点结果」，人脸位置叠加了绿色的关键点与连线网格；下方「检测结果」卡片会显示检测到的人脸数量。若画面中没有可识别的人脸，会提示「未检测到人脸，请尝试其他图片」。

5. **下载结果**：在「检测结果」卡片中，点击「下载标注图」可保存带关键点网格的 PNG 图片；点击「下载 JSON」则导出每张人脸 478 个关键点的归一化坐标（x、y、z，取值 0–1），可用于二次开发。

## 使用技巧

- **首次加载请耐心等待**：模型文件较大，第一次点击检测需要下载并初始化 MediaPipe 模型，进度条走完即可；之后模型会缓存在浏览器中，再次使用速度明显加快。
- **清晰正脸效果最好**：面部无遮挡、光线充足、分辨率适中的照片关键点定位最准；过度模糊、大角度侧脸、戴口罩或墨镜的照片可能漏检或定位偏移。
- **合影可以一次检完**：多人合照无需裁剪，工具会自动遍历画面中的所有人脸并分别绘制网格，检测结果卡片会报告人脸总数。
- **超限图片先压缩**：超过 10MB 会提示「图片大小不能超过 10MB」，可先用工具派的图片压缩工具处理后再上传。
- **JSON 坐标记得换算**：导出的 x、y 是相对图片宽高的 0–1 比例值，乘以图片实际像素宽高即可还原像素坐标；z 为相对深度，同样做了归一化。
- **隐私敏感场景放心用**：整个检测在浏览器本地完成，照片不会经过网络传输，适合处理不便外传的证件照、生活照。

## 常见问题

**Q1：478 个关键点是什么？**
MediaPipe Face Landmarker 模型为每张人脸输出 478 个特征点，分布在眉毛、眼睛、鼻子、嘴唇轮廓和面部外轮廓上。工具会把这些点以及点之间的连线（网格）绘制在结果图上，形成常见的「人脸网格」效果。

**Q2：我的照片会上传到服务器吗？**
不会。模型在浏览器本地加载和运行，图片始终留在你的设备上，整个检测过程不经过网络传输，隐私有充分保障。

**Q3：支持同时检测多个人脸吗？**
支持。合影中每张人脸都会被独立检测并绘制各自的关键点网格，「检测结果」卡片会显示检测到的人脸总数；下载的 JSON 中每张人脸用 `faceIndex` 字段区分。

**Q4：为什么提示「未检测到人脸，请尝试其他图片」？**
常见原因包括人脸在画面中占比太小、照片过度模糊、大角度侧脸、面部被手或物品遮挡、光线太暗等。换一张清晰、正脸、面部占比适中的照片再试即可。

**Q5：支持哪些图片格式？有大小限制吗？**
支持 JPG、PNG、WEBP 等浏览器可解析的常见图片格式，单个文件最大 10MB。超过限制会提示「图片大小不能超过 10MB」，需要先压缩再上传。

**Q6：下载的 JSON 里 x、y、z 分别代表什么？**
x、y 是关键点相对于图片宽、高的归一化坐标（取值 0–1），乘以图片实际宽高即可得到像素位置；z 表示该点相对于面部平面的深度信息，同样经过归一化，可用于三维面部分析与 AR 应用。


工具派 AI 人脸检测与关键点教程：基于 MediaPipe Face Landmarker 在浏览器本地运行，照片不上传服务器。支持 JPG/PNG/WEBP，自动检测多张人脸并绘制 478 个关键点网格，可下载标注图与归一化 JSON 坐标数据。

AI 人脸检测与关键点教程：浏览器本地定位 478 个人脸关键点