obs中html不显示是因为未使用浏览器源；必须添加浏览器源并正确配置url或file://路径，注意本地文件跨域限制、渲染设置及通信方式。
HTML源在OBS里不显示？先确认是否用了浏览器源
OBS Studio本身不直接解析HTML文件，所谓“HTML源”实际是通过浏览器源（Browser Source）加载网页内容。如果你双击场景里的某个源想编辑HTML，却看到空白或报错，大概率是误用了图像源或媒体源——它们根本不支持HTML。
- 必须添加的是
浏览器源（右键场景 → “添加” → “浏览器源”） -
浏览器源加载方式有两种：填URL（如https://example.com）或填本地file://路径（如file:///C:/my-page/index.html） - 本地HTML若引用了
./script.js或./style.css，路径必须相对且文件在同一目录下；OBS不会自动补全或递归加载子资源 - Windows下
file://路径需用三个斜杠：file:///C:/...，少一个就加载失败
本地HTML加载后空白或报跨域错误？检查CORS和本地协议限制
OBS的浏览器源底层用的是Chromium，对file://协议有严格限制：默认禁用XMLHttpRequest、fetch、WebSockets，且不允许读取本地JS/CSS以外的其他本地资源（比如file:///C:/data.json）。
- 现象：
Failed to load resource: net::ERR_FILE_NOT_FOUND或Access to script at 'file:///...' from origin 'null' has been blocked - 解决方法一：把页面部署到本地HTTP服务，比如用
python3 -m http.server 8000，然后在浏览器源里填http://localhost:8000/index.html - 解决方法二：启动OBS时加命令行参数
--disable-web-security（仅调试用，有安全风险，且新版OBS可能忽略该参数） - 注意：
file://下localStorage、indexedDB也基本不可用，别依赖这些做状态持久化
文字模糊、缩放异常、高DPI下错位？调整浏览器源的渲染设置
OBS的浏览器源默认使用软件渲染，且未适配高分屏缩放，在4K屏或系统缩放设为125%/150%时，常出现字体发虚、按钮错位、滚动条消失等问题。
- 在浏览器源属性中勾选
使用硬件加速（Hardware Acceleration），能显著改善清晰度和性能 - 取消勾选
释放未使用的内存（Release unused memory），避免频繁GC导致卡顿 - 分辨率匹配很关键：如果HTML设计为1920×1080，就在浏览器源属性里手动设宽高为
1920×1080，不要依赖“自适应”——它会按容器拉伸，破坏CSS布局 - 若HTML内用了
vh/vmax等视口单位，建议在里加<meta name="viewport" content="width=device-width, initial-scale=1">，否则OBS可能按默认980px宽度渲染
需要实时传参或控制HTML？用query string或OBS WebSocket配合js事件
OBS本身不提供JS API给浏览器源调用，但可以通过URL参数或外部工具实现双向通信。
- 简单传参：启动时在浏览器源URL里加
?scene=game&score=123，HTML里用new URLSearchParams(window.location.search)读取 - 动态更新：改用
http://localhost:8000/overlay.html?ts=1712345678900这种带时间戳的URL，配合OBS的“重新加载页面”按钮或脚本定时刷新 - 进阶控制：装
obs-websocket插件，再用HTML里的fetch调用本地WebSocket服务（如http://localhost:4444），触发OBS场景切换、音量调节等操作——但前提是你的HTML跑在http://而非file://下 - 注意：
浏览器源不支持postMessage与OBS主进程通信，别在这上面浪费时间
真正麻烦的不是怎么加HTML，而是本地路径权限、渲染精度、以及“以为能直接执行JS”这个误解。很多问题其实卡在第一步——没意识到浏览器源才是唯一入口。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
