摄像头拍照与录像
用浏览器摄像头拍照或录像：切换前后摄像头、镜像预览、截图下载 PNG、录制并下载 WebM 视频，全部在本地完成。
浏览器本地运行所有计算都在你的浏览器里完成，数据不会离开本机。
摄像头
视频流只在本地处理，不会上传到任何服务器；浏览器会先询问摄像头权限。
状态: 尚未开始
环境检查
- HTTPS / 安全上下文支持
- getUserMedia不支持
- MediaRecorder不支持
照片
拍照后可在这里预览并下载 PNG。
录像
停止录像后可在这里预览并下载视频。
这个工具能做什么
- 手边只有一台笔记本或手机，临时要拍一张证件照、白板照片或商品图，打开网页就能拍，不用装 App。
- 录一段屏幕前的讲解或演示短视频，停止后直接下载 WebM 文件，交给剪辑软件或聊天工具。
- 需要自拍效果的预览：前置摄像头默认镜像显示，拍出来的照片与预览一致。
- 排查摄像头问题：页面会先检查 HTTPS 安全上下文、getUserMedia 与 MediaRecorder 是否可用，再把权限拒绝、设备被占用等错误翻译成人话。
示例
输入
开启摄像头（前置 user，理想宽度 1280），点击「拍照」
输出
unikit-photo-20261010-153045.png
这是下载文件名的真实格式：`unikit-photo-<本地日期>-<本地时间>.png`。拍照时会按最长边等比缩放到 1280 像素以内（不放大原图），勾选镜像时画面左右翻转后再截图；如果开启镜像，截出的图片和预览一致，文字会反。
常见问题
为什么提示无法使用摄像头？
最常见的是权限被拒绝（浏览器地址栏里可以重新允许）、页面不是 HTTPS（浏览器只在安全上下文里开放摄像头）、摄像头被其他程序占用（会议软件、录屏工具），或者设备本身没有摄像头。页面会把这几类情况分别给出提示，先看「环境检查」那三项是否都是「支持」。
为什么必须 HTTPS，本地打开文件不行吗？
浏览器规定摄像头属于敏感能力，只在安全上下文里可用。`https://` 和 `http://localhost` 都算安全上下文，而直接用 `file://` 打开或走普通 `http://` 页面会拿不到 getUserMedia。本地开发请用开发服务器（通常是 localhost）。
录像是什么格式，能不能录声音？
录像优先选择浏览器支持的容器，顺序是 WebM/VP9、WebM/VP8、WebM，都不支持时才退回 MP4，文件名扩展名会跟着变。音频不采集：`getUserMedia` 只请求 video，所以录出来的视频是无声的，这也是它不需要麦克风权限的原因。
照片和视频会上传吗？
不会。视频流由浏览器直接交给页面上的 video 元素，截图走 canvas 的 `toDataURL`，录像走 MediaRecorder 加 Blob 对象 URL，全程没有任何网络请求，关掉页面后内存里的流和 URL 都会被释放。
镜像开关影响什么？
只影响截图的像素。预览时的镜像由 CSS 完成，拍照时若勾选镜像，会在 canvas 上做一次水平翻转，使图片与预览一致——对自拍更自然，但拍文档或白板时建议关掉，否则文字会左右颠倒。
关键词：camerawebcam拍照录像getUserMediaMediaRecorder摄像头mirror拍照工具