5步搞定AI手势识别API：Flask后端+彩虹骨骼可视化部署教程

5步搞定AI手势识别APIFlask后端彩虹骨骼可视化部署教程1. 引言1.1 学习目标本教程将带你快速搭建一个基于MediaPipe Hands模型的手势识别API服务包含以下核心内容5分钟内完成环境配置与依赖安装实现Flask后端API接口开发集成彩虹骨骼可视化功能一键测试与部署方案常见问题排查指南1.2 前置准备只需具备基础Python编程能力能运行命令行的电脑Windows/Mac/Linux均可无需GPU普通CPU即可流畅运行1.3 项目亮点极简部署所有依赖内置无需额外下载模型炫酷效果独家彩虹骨骼可视化五指分色显示开箱即用完整代码可直接复制使用性能优异单张图片处理仅需50-100ms2. 环境配置与快速启动2.1 创建项目目录建议按以下结构组织代码hand_api/ ├── app.py ├── hand_tracker.py ├── static/ │ └── uploads/ └── requirements.txt2.2 安装依赖创建requirements.txt文件并写入flask2.3.3 opencv-python4.8.0.74 mediapipe0.10.9 numpy1.24.3运行安装命令pip install -r requirements.txt2.3 验证安装测试MediaPipe是否能正常导入import mediapipe as mp print(mp.__version__) # 应输出0.10.93. 核心代码实现3.1 手势检测模块创建hand_tracker.py文件import cv2 import mediapipe as mp import numpy as np class HandTracker: def __init__(self): self.mp_hands mp.solutions.hands self.hands self.mp_hands.Hands( static_image_modeTrue, max_num_hands2, min_detection_confidence0.6 ) # 彩虹颜色配置BGR格式 self.colors [ (0, 255, 255), # 黄拇指 (128, 0, 128), # 紫食指 (255, 255, 0), # 青中指 (0, 255, 0), # 绿无名指 (0, 0, 255) # 红小指 ] def draw_rainbow_hand(self, image, landmarks): h, w image.shape[:2] points [(int(lm.x*w), int(lm.y*h)) for lm in landmarks] # 绘制关节白点 for pt in points: cv2.circle(image, pt, 5, (255,255,255), -1) # 绘制彩色骨骼线 connections [ (0,1,2,3,4), # 拇指 (0,5,6,7,8), # 食指 (0,9,10,11,12), # 中指 (0,13,14,15,16),# 无名指 (0,17,18,19,20) # 小指 ] for finger_idx, finger in enumerate(connections): for i in range(len(finger)-1): start finger[i] end finger[i1] cv2.line(image, points[start], points[end], self.colors[finger_idx], 2) return image def process(self, image_path): image cv2.imread(image_path) if image is None: return None rgb_image cv2.cvtColor(image, cv2.COLOR_BGR2RGB) results self.hands.process(rgb_image) if results.multi_hand_landmarks: for hand_landmarks in results.multi_hand_landmarks: image self.draw_rainbow_hand(image, hand_landmarks.landmark) return image3.2 Flask API服务创建app.py文件from flask import Flask, request, jsonify, send_file import os from hand_tracker import HandTracker app Flask(__name__) tracker HandTracker() UPLOAD_FOLDER static/uploads os.makedirs(UPLOAD_FOLDER, exist_okTrue) app.route(/api/detect, methods[POST]) def detect_hand(): if file not in request.files: return jsonify({error: 请上传图片文件}), 400 file request.files[file] if file.filename : return jsonify({error: 未选择文件}), 400 if file: save_path os.path.join(UPLOAD_FOLDER, file.filename) file.save(save_path) try: result_img tracker.process(save_path) if result_img is None: return jsonify({error: 图片处理失败}), 400 result_path save_path.replace(., _result.) cv2.imwrite(result_path, result_img) return send_file(result_path) except Exception as e: return jsonify({error: str(e)}), 500 if __name__ __main__: app.run(host0.0.0.0, port5000)4. 测试与部署4.1 启动服务python app.py服务将在http://localhost:5000启动4.2 测试API使用curl测试curl -X POST -F filetest.jpg http://localhost:5000/api/detect --output result.jpg或使用Python代码测试import requests url http://localhost:5000/api/detect files {file: open(test.jpg, rb)} response requests.post(url, filesfiles) with open(result.jpg, wb) as f: f.write(response.content)4.3 推荐测试图片比耶手势✌️点赞手势张开手掌️握拳✊5. 常见问题解决5.1 图片上传失败现象返回400错误解决检查文件大小不超过5MB确保上传的是JPG/PNG格式使用curl -v查看详细请求5.2 检测不到手部现象返回空白图片解决确保手部占据图片主要区域尝试调整手部角度正对手掌效果最佳检查环境光线充足5.3 性能优化建议对于视频流设置static_image_modeFalse如果只需单手检测设置max_num_hands1降低输入图片分辨率推荐640x4806. 总结6.1 核心成果通过本教程你已经完成MediaPipe手势识别环境搭建Flask API服务开发彩虹骨骼可视化实现完整测试流程验证6.2 进阶方向添加手势分类功能识别特定手势扩展为视频流实时处理开发Web前端交互界面部署为Docker容器服务获取更多AI镜像想探索更多AI镜像和应用场景访问 CSDN星图镜像广场提供丰富的预置镜像覆盖大模型推理、图像生成、视频生成、模型微调等多个领域支持一键部署。