网络摄像头照片，免费

工作原理

1. 授权摄像头：点击「启动摄像头」并在浏览器提示时授予访问权限。
2. 调整选项：选择滤镜，启用镜像模式，并设置计时器以便在触发前就位。
3. 拍摄并下载：点击「拍照」。照片会累积在画廊中，可单独下载或批量下载。

常见问题

我的照片会被发送到网上吗？

不会。所有处理都通过 MediaDevices API 在您的浏览器中进行；图像从不离开您的设备。没有服务器会看到或存储您的视频流。

为什么摄像头无法启动？

请检查您是否在浏览器设置中授予了摄像头访问权限、网站是否通过 HTTPS 提供（摄像头访问所必需），以及是否有其他应用程序已在使用它。

可以在多个摄像头之间选择吗？

可以。如果连接了多个摄像头，「摄像头」选择器会列出所有：内置摄像头、外置 USB 摄像头、虚拟摄像头等。

浏览器摄像头的实际工作原理

浏览器相机访问由W3C Media Capture and Streams 规范管控。入口点是 navigator.mediaDevices.getUserMedia()：页面调用此函数时传入一个描述所需流类型的约束对象。浏览器显示权限提示；若您允许，该函数将返回一个包含一个或多个视频轨道的 MediaStream 对象。页面将该流绑定到 <video> 元素（video.srcObject = stream），实时画面随即显示在屏幕上，然后在用户点击「拍照」时将视频帧绘制到HTML5 <canvas> 上即可捕获画面。画布通过 canvas.toBlob('image/jpeg') 导出，生成可下载的JPG文件。任何帧都不会离开您的设备，整个流程都在浏览器进程内完成。

基于Promise的 getUserMedia 在Chrome 53（2016年9月）和Firefox 36（2015年2月）中以无前缀形式发布。Safari是最后跟进的：网页访问摄像头直到iOS 11（2017年9月）才在iOS上实现，现代稳定目标是iOS 14.5或更高版本。到2026年，该API基本上已普及，caniuse显示全球支持率超过97%。

为何HTTPS是强制要求

getUserMedia 仅限于「安全上下文」：HTTPS、桌面端的 localhost，或Firefox中的 file://。通过HTTP提供的页面完全无法访问摄像头；调用会因 NotAllowedError 被拒绝。这是此类自托管工具中最常见的部署错误，并且每个现代浏览器都统一强制执行。移动端要求更为严格：手机上没有 localhost 豁免，因此在本地开发服务器上测试摄像头工具需要使用ngrok等隧道工具或带TLS的反向代理。

约束：如何请求正确的摄像头

约束对象是API中最复杂的部分。常用选项如下：

• width / height：接受字面数值或包含 min、ideal、max、exact 的对象。ideal 是实用默认值；浏览器会尽可能接近目标值，而不会因无法完全匹配的摄像头而报错。exact 则在硬件无法满足时直接拒绝。
• facingMode：'user' 表示前置（自拍）摄像头，'environment' 表示后置。在只有一个摄像头的笔记本电脑上，此约束会被静默忽略；在手机上，这是无需枚举设备即可选择正确镜头的最简洁方式。
• frameRate：大多数网络摄像头上限为30fps；部分外接USB摄像头可达60fps。
• deviceId：用于在通过 navigator.mediaDevices.enumerateDevices() 枚举设备后选择特定设备。重要细节：在本次会话中用户至少授予一次摄像头权限之前，label 是空字符串，因此在任何权限授予之前运行的「选择摄像头」下拉菜单只会显示无标签的ID。上方的摄像头下拉菜单通过仅在「开启摄像头」成功后填充来规避此问题。

摄像头指示灯是您的信任标志

在2008年或更新款的Mac上，摄像头旁边的绿色LED与传感器连接在同一电源轨上。macOS和固件确保传感器通电时LED始终亮起，Apple的设计使得即使内核级恶意软件也无法在摄像头录制时关闭LED。iOS自iOS 14（2020年9月发布）起在屏幕顶部实现了橙点指示器，由应用无法压制的系统进程绘制。Windows摄像头在大多数现代设备上采用类似方案，但执行力度不那么统一，2010年的少数旧USB摄像头使用了软件控制的LED。Linux因硬件而异。

结论：相信指示灯，而非网站。像这样的纯浏览器工具可以真诚地保证任何内容都不会离开您的设备，而摄像头指示灯能独立确认页面显示摄像头关闭时摄像头确实已关。摄像头工具中最常见的bug是关闭时忘记调用 stream.getTracks().forEach(t => t.stop())，症状是：用户认为已关闭摄像头后，指示灯仍保持亮起。本页的「停止摄像头」按钮会明确调用该方法。

何时会用到浏览器摄像头工具

• 快速个人头像：用于Slack、Discord、GitHub、社交媒体，无需安装单独的摄像头应用。
• 证件照风格的照片：在家拍摄用于在线表格（驾照更新、签证申请）。正是在这种场景下，基于浏览器的隐私保障尤为重要，因为将面部照片上传到第三方服务会让人不安。
• 视频会议预览：在加入Zoom或Teams通话前检查灯光、取景和虚拟背景效果。
• 学校和远程办公签到：当教师或雇主要求发送快速自拍以确认出席时。
• 艺术和设计参考照：手部姿势照片、3D建模用的物体照片、自画像素描参考。
• 活动中的轻量级照相亭：在笔记本电脑上运行一个专属页面，让宾客无需安装应用即可自拍。
• 原型设计和模型：设计包含「拍一张自拍」步骤的流程的设计师需要一个快速测试页面。
• 教育演示：教师向学生展示现代Web Camera API的工作原理。

与macOS上的Photo Booth或Windows上的相机应用相比，此工具的差异在于无需安装任何东西、不上传任何内容，这对无法安装软件的受限工作电脑和共享信息终端尤为实用。

滤镜：CSS filter属性能带来什么

HTML5画布可以通过 ctx.filter 属性应用CSS滤镜语法。上方提供的滤镜使用与任何CSS规则相同的基本效果：grayscale(1)（完全去饱和，等价于亮度投影）、sepia(1)（模拟老照片的暖棕色调）、invert(1)（色彩负片）、blur(5px)（高斯模糊）、brightness(1.4)（倍乘像素亮度）和 contrast(1.4)（以中间灰为轴调整对比度）。自Chrome 53 / Firefox 35 / Safari 9.1以来，每个浏览器都对其进行了硬件加速。

有一个微妙但重要的细节：应用于 <video> 元素的CSS滤镜不会传递到画布。若要将滤镜烘焙到保存的JPG中，必须先在 ctx.filter 上设置相同的滤镜，然后再调用 drawImage。本页面已完成此操作，因此屏幕预览与保存的文件像素完全一致。

常见错误及其含义

如果「开启摄像头」失败，拒绝信息会作为 DOMException 返回，包含以下名称之一：

• NotAllowedError：您（或上一个会话）拒绝了权限，或页面未在HTTPS上。查看地址栏的网站权限菜单，确保摄像头已设置为「允许」或「询问」。
• NotFoundError：找不到匹配的设备。最常见于在没有后置摄像头的桌面设备上以 facingMode: 'environment' 配合 exact 请求时。
• NotReadableError：硬件正被另一个应用使用。Zoom、Teams、OBS或另一个浏览器标签页已开启摄像头。关闭它们后重试。
• OverconstrainedError：约束无法满足。去除 exact 要求或放宽分辨率要求。
• TypeError：约束对象为空。调用时必须至少请求音频或视频之一。

更多问题

为什么我的图像是倒置的或侧向的？

某些Android摄像头在EXIF元数据中报告了错误的旋转信息。浏览器通常在视频帧到达画布之前自动应用旋转，但旧版Samsung Internet和部分内嵌WebView会跳过这一步骤。如果拍出的照片是侧向的，请在拍照前将设备旋转90°，或事后使用图像旋转工具。

为什么下拉菜单显示「摄像头 1、摄像头 2」而不是名称？

因为浏览器尚未获得摄像头权限。enumerateDevices() 仅在用户当前会话中至少批准过一次摄像头访问之后才返回标签（如「FaceTime HD Camera」）；在此之前，只返回不透明的ID。点击「开启摄像头」一次并允许访问后，下拉菜单将刷新显示正确的名称。

关闭页面后摄像头指示灯会保持亮起吗？

不会。「停止摄像头」按钮会明确停止流中的每个轨道，现代浏览器在标签页隐藏或页面卸载时也会停止轨道。如果您发现关闭标签页后摄像头LED仍保持亮起，这是一个值得上报的bug，通常意味着页面未调用清理函数。在本工具中，点击「停止摄像头」或关闭标签页会立即释放硬件。

我可以录制视频而不仅仅是拍照吗？

本工具不支持，它仅限于静态照片捕获。录制视频需要 MediaRecorder API，根据浏览器不同会生成WebM、MP4或MKV格式的文件。录制还涉及其自身的隐私问题（您正在存储大量可识别的画面），因此这是一个独立的使用场景，值得使用专属工具处理。

有任何内容会发送至服务器吗？

不会。视频流由操作系统直接传送至浏览器；画布捕获和JPG导出通过JavaScript在本地完成；相册保存在浏览器内存中，直接下载到您的设备。您的摄像头、您的面部照片，以及您拍摄的任何照片，都不会离开页面。

相关工具