打开摄像头之后，还有哪些事情要做好？

先让预览独立工作

在见微里，打开摄像头与开始检测是两个动作。用户点击打开后，页面先申请相机权限、连接视频流；模型准备好后，再开始分析。模型加载较慢时，用户仍能看到预览，知道相机是否已经正常工作。

这个拆分也让暂停更清楚：暂停检测保留预览，关闭摄像头则释放设备。两个按钮分别对应不同的用户意图。

权限弹窗，是一个异步过程

用户可能在授权弹窗打开时取消操作。如果旧请求稍后返回，我们不应该再次打开画面。实现里给每次请求一个递增的编号，检查结果是否仍属于当前请求；已经过期的流会立即停止。

const request = ++cameraRequest;
const media = await navigator.mediaDevices.getUserMedia({
  video: { facingMode: 'user' },
  audio: false
});

if (request !== cameraRequest) {
  media.getTracks().forEach(track => track.stop());
  return;
}

这里展示的是项目中的核心控制思路；实际页面还处理了错误反馈、视频播放和返回前台等状态。

页面离开时，收好摄像头

页面进入后台后，已经启动的摄像头会关闭，当前检测结果也会失效。若授权刚好在页面隐藏时返回，视频轨道先被禁用，等用户回到页面再恢复。

同样重要的是停止轨道，而不只是隐藏视频元素。界面消失与硬件释放，是两件不同的事。

让错误提示给出下一步

拒绝授权、没有摄像头、设备被占用、内置浏览器限制，页面会给出相应说明。对于从 X 打开的访客，还提供复制链接到系统浏览器的入口，以及照片识别作为替代输入。

好的错误提示不只说“失败了”，还要告诉使用者现在能做什么。

这些交互已用自动测试覆盖请求取消和授权竞态。真实手机上的权限界面与摄像头行为仍需要逐设备验证，测试不能替代实际体验。