HTML5敏感API仅在Secure Context中运行，即HTTPS页面或http://localhost等本地回环地址；file://和普通http://因不满足安全上下文要求而被浏览器静默拒绝。
HTML5 敏感 API（如摄像头、麦克风、地理位置、剪贴板写入、Notifications、Service Worker 等）不会在 file:// 或普通 http:// 页面中运行，这是浏览器强制执行的安全机制，不是配置问题，也不靠“手动开启权限”。关键在于：这些 API 只能在 Secure Context（安全上下文）中调用，而现代浏览器认定的 Secure Context 仅限于：
哪些地址算 Secure Context？
Chrome、Edge、Firefox 等主流浏览器严格遵循 W3C Secure Contexts 规范。以下两种情况被明确视为安全上下文：
-
HTTPS 协议访问的线上页面：例如
https://example.com/page.html，需使用有效 SSL/TLS 证书（Let’s Encrypt 免费证书即可满足） -
本地回环地址：包括
http://localhost、http://127.0.0.1及其指定端口（如http://localhost:8080），无需 HTTPS 也可启用全部敏感 API
为什么 file:// 和 http:// 不行？
直接双击打开本地 HTML 文件（file:///Users/xxx/index.html）或通过非加密 HTTP 访问（http://192.168.1.100），浏览器会静默拒绝敏感 API 调用，常见表现有：
-
navigator.mediaDevices.getUserMedia()抛出NotAllowedError或SecurityError -
navigator.clipboard.writeText()拒绝执行，控制台提示Failed to execute 'writeText' on 'Clipboard': Document is not focused or permission denied -
navigator.geolocation.getCurrentPosition()不弹出授权提示，回调直接失败 - Service Worker 注册失败，报错
Only secure contexts can register a service worker
本地开发时如何确保 Secure Context？
不要尝试禁用浏览器安全策略（如 --unsafely-treat-insecure-origin-as-secure），这些 flag 已被 Chrome 逐步废弃且不可靠。推荐做法是启动一个轻量本地 HTTP 服务：
html-to-pptx-converter
下载
使用 PptxGenJS 和 Python 解析，将结构化的 HTML/CSS 幻灯片内容转换为原生、可编辑的 PowerPoint（.pptx）演示文稿。
立即学习“前端免费学习笔记（深入）”；
- VS Code 用户：安装 Live Server 插件，右键 HTML 文件 → “Open with Live Server”
- 终端命令（Python 3）：
python3 -m http.server 8000，然后访问http://localhost:8000 - Node.js 环境：
npx http-server -c-1或npx serve
这样所有本地资源（JS/CSS/JSON/图片）都能正常加载，且敏感 API 完全可用。
线上部署必须用 HTTPS
上线前务必配置 HTTPS，否则用户访问时敏感功能将全部失效。可采用以下方式快速启用：
- 静态站点托管（如 GitHub Pages、Vercel、Netlify）默认提供免费 HTTPS
- 自建服务器：用 Let’s Encrypt + Certbot 自动签发和续期证书
- 云服务商（阿里云、腾讯云）提供免费 DV 证书，控制台一键部署
注意：自签名证书不被浏览器信任，无法构成 Secure Context；HTTP + 自签名证书仍无效，必须是真实可信的 HTTPS。
