许多工控平台和物联网监控大屏采用 iframe 嵌套形式来加载第三方在线工具。但由于安全审计限制，网页调用 Web Serial API 会默认受阻。根因通常是父级页面的 **Permission-Policy（权限策略）** 未对 iframe 授权 `serial`。
### 正确嵌入方式
在父页面 HTML 中显式写：
```html <iframe src="https://www.serialpro.top/" allow="serial"></iframe> ```
`allow="serial"` 表示父窗口信任该子页面，并把串口物理访问权向下传递。只有配置后，iframe 内调用 `navigator.serial.requestPort()` 时，用户才能看到系统原生端口选择框。
### 常见踩坑
- **跨域 + 无 allow**：`navigator.serial` 为 `undefined` 或 requestPort 直接拒绝。
- **沙箱属性冲突**：若同时写了 `sandbox` 且未放行必要能力，仍可能失败；尽量避免过度 sandbox，或按规范组合权限。
- **非安全上下文**：iframe 自身也必须是 HTTPS 或 localhost，否则 Secure Context 不满足。
- **移动端 / 非 Chromium**：Web Serial 本身不可用，与 iframe 无关。
联调建议：先在顶层标签页验证工具可连串口，再嵌 iframe；浏览器开发者工具 Application / Permissions 可核对策略。完成授权后，工控大屏即可内嵌免安装串口助手，而无需另装桌面软件。