💻 Camera Recording

Record video and audio from your camera and microphone in your browser — no files uploaded, saved locally.

📐 工作原理与说明

把本次记录时长与标签写入本地存储的历史数组：与上一条记录数值相同且标签相同（或标签为空）时不重复追加，数组最长只保留最近 30 条。历史少于 2 条时提示「操作 2 次以上后显示趋势图」；否则以序号为横轴、时长为数据绘制折线图，明细表逐行输出序号、记录时间（本地时间字符串）、时长与类型，并给出相邻记录的变化对比框，同时提供导出 CSV 按钮

调用浏览器媒体 API 采集摄像头画面并录制为视频文件。

采集：getUserMedia({video:true,audio:true}) 获取媒体流，绑定到 video 元素预览。
录制：MediaRecorder 录制流，数据在 ondataavailable 中以 Blob 分块返回。
前提：需 HTTPS 或 localhost（安全上下文），且用户明确授权摄像头权限。
格式：用 MediaRecorder.isTypeSupported() 检测容器/编码支持（常为 WebM）。

🔒 视频仅在本地录制与保存，不会上传任何服务器。首次使用需授予摄像头/麦克风权限。录制格式为 WebM（Chrome/Edge/Firefox 支持）。

📚 深度解析：摄像头录制

💡 常见使用场景

调用 getUserMedia 在本地录制视频/截图。

录制操作教程或问题复现视频：在不装任何软件的前提下，用浏览器直接录屏级演示，导出后附到工单里。

录制

授权摄像头后录制为 webm（纯前端，不上传）。

❓ 常见问题（FAQ）

需要权限吗？

需用户授权摄像头，且仅 HTTPS/localhost 可用。

为什么浏览器请求不了摄像头？

常见原因有三：页面不是 HTTPS（localhost 除外），浏览器会直接拒绝 getUserMedia；用户在权限弹窗里点了拒绝且未重置；或系统层面（macOS 的「摄像头」隐私设置、Windows 的相机权限）禁止了该浏览器。逐项检查即可。

Item

Formula / Note

Source / Standard

Capture

getUserMedia needs a secure context and user consent

W3C Media Capture and Streams

Codec

MediaRecorder mimeType support varies by browser

W3C MediaStream Recording

Privacy

explicit consent plus visible indication while recording

W3C Media Capture and Streams

摄像头录制

💻 Camera Recording

📚 深度解析：摄像头录制

💡 常见使用场景

❓ 常见问题（FAQ）

Formula & Standard References

🔗 相关工具

🔗 相关工具