通过WebRTC获取摄像头影像
这篇技术文章讲的是如何利用 WebRTC API 在网页中调用摄像头并实现一键截图。作者从基础的 video 标签搭建开始，引出了核心的 `navigator.getUserMedia` 接口，并特别指出了它在当时浏览器环境下的兼容性现实：Chrome 和 Firefox 需要加前缀，移动端支持不佳。 文章的核心实现思路清晰：通过 `getUserMedia` 请求摄像头权限，成功后拿到视频流，再通过 `window.URL.createObjectURL` 将流媒体转换为 URL 填入 video 标签播放。截图功能则依赖 canvas 的 `drawImage` 方法，把视频当前帧“画”上去。作者贴心地给出了处理浏览器差异的兼容代码，并分享了一个实战中遇到的“坑”：在 Firefox 中无法通过常规事件可靠获取视频尺寸，最终采用 `setTimeout` 轮询的变通方案来绑定截图按钮。 除了核心步骤，文章末尾还补充了几个有价值的细节，比如同一浏览器不同标签页可以共享摄像头，但不同浏览器不行；以及推荐将截图上传至服务器再提供下载，而非在本地强制保存。整体上，这是一份对前端开发者来说相当直接、步骤明确的实践指南。