选择允许框架嵌入的托管平台
查找游戏托管方或创作者提供的具体嵌入网址或组件说明。例如,itch.io 介绍了如何嵌入以兼容格式上传的 HTML5 项目。托管方仍负责提供游戏;你的页面只是显示其播放器。不要假设任意游戏网址都能放入 iframe,也不要认为下载网页就获得了再分发权。
询问托管方要求配置哪些项目:允许的域名、响应式尺寸、全屏行为、署名方式,以及是否涉及外部脚本或 Cookie。如果许可不明确,请联系创作者或改用链接。页面应保留清楚的游戏标题和直接启动链接,方便使用键盘或辅助技术的访客找到游戏。
添加响应式框架并进行测试
以官方嵌入代码为起点。为 iframe 添加描述性标题,设置合适的宽高比,并限制在内容区域的宽度内。例如,把 16:9 的游戏框放在会随网页缩放的容器中,而不是固定为 1280 像素宽。除非游戏确实需要,否则不要授予摄像头或麦克风等广泛权限。
在手机和桌面尺寸下测试页面,并检查键盘导航和浏览器控制台。空白框架可能是托管方 Content Security Policy 的 frame-ancestors 规则或浏览器限制造成的;修改自己网页无法覆盖托管方的拒绝。查看托管方状态;嵌入失败时提供普通启动链接。
保持游戏周边页面易用
开始前说明游戏是否需要声音、键盘或手柄。条件允许时,将说明和退出路径放在框架外,因为嵌入文档可能不会向你的网页公开内部控制。
关于在网站中嵌入游戏的常见问题
任何浏览器游戏网址都能放进 iframe 吗?
不能。托管方可能禁止框架嵌入,创作者许可也可能不允许。请使用官方嵌入选项或征求许可;普通链接是更安全的备用方式。
我的网页能控制嵌入的游戏吗?
通常不能直接访问 iframe 内部。浏览器的同源策略会限制跨站访问;交互需要双方都提供有文档说明的消息 API。
延伸阅读
发现信息过时了? 报告需要更正的内容