Safari Mobile在HTTP环境下无法打开摄像头相关问题咨询

你遇到的问题核心是Safari的安全策略限制：只有**安全上下文（Secure Context）**才允许调用getUserMedia等媒体设备API，localhost被浏览器默认归为安全上下文可直接调用，但是局域网IP（如192.168.0.12）不属于安全上下文范围，非HTTPS场景下会直接拦截API调用，不会触发权限申请弹窗。

方案1：给本地开发服务配置HTTPS（推荐，和生产环境行为一致） #

• 第一步：用mkcert工具生成本地受信任的自签名证书，操作步骤如下：
  1. 本地开发机安装mkcert，执行mkcert -install将根证书加入本机信任链
  2. 执行mkcert 192.168.0.12生成对应IP的证书文件，会得到192.168.0.12.pem和192.168.0.12-key.pem两个文件
• 第二步：配置你的前端开发服务启用HTTPS，加载生成的证书，比如：
  • Vite项目：在vite.config.js中添加server.https配置，指定cert和key的文件路径
  • Webpack项目：在devServer配置中开启https，传入证书路径
• 第三步：iPhone端安装mkcert的根证书并信任：
  1. 将mkcert生成的根证书（可通过mkcert -CAROOT命令查看路径）通过AirDrop发送到iPhone，按照提示安装
  2. 进入iPhone设置 > 通用 > VPN与设备管理，确认根证书已安装
  3. 进入设置 > 通用 > 关于本机 > 证书信任设置，开启对应根证书的完全信任
• 配置完成后用https://192.168.0.12:3000访问即可正常触发摄像头权限申请。

方案2：临时开启Safari不安全站点媒体捕获权限（仅本地测试用） #

如果只是临时调试不想配证书，可以用Safari的开发者选项绕过限制：

1. 先开启iPhone开发者模式：设置 > 隐私与安全性 > 开发者模式，开启后重启手机
2. 进入设置 > Safari > 高级 > 实验性功能，找到「Media Capture on Insecure Sites」（部分版本中文显示为「不安全站点的媒体捕获」），开启对应开关
3. 刷新页面即可触发摄像头权限申请

额外排查点 #

如果配置后仍然没有弹窗，确认系统设置中Safari的摄像头权限处于开启状态：设置 > Safari > 相机，选择「询问」或者「允许」。

内容的提问来源于stack exchange，提问作者ousmane784