OBS Browser 插件使用指南及问题解决

最新推荐文章于 2025-04-01 17:41:00 发布

窦萍娴Prudent

最新推荐文章于 2025-04-01 17:41:00 发布

阅读量1.3k

点赞数 12

本文链接：https://blog.csdn.net/gitblog_01252/article/details/143043968

版权

OBS Browser 插件使用指南及问题解决

obs-browser 项目地址: https://gitcode.com/gh_mirrors/obs/obs-browser

项目基础介绍

OBS Browser 是一个基于 Chromium Embedded Framework (CEF) 的 OBS Studio 扩展插件，它允许用户将交互式网页元素整合到直播场景中，充分利用现代Web技术如HTML、CSS和JavaScript。此插件支持服务集成和服务端口对接，并且可以在除Wayland外的多数Linux平台以及Windows和macOS上实现浏览器面板的内嵌显示。项目的编写主要采用了C++语言，并通过JavaScript绑定提供了与OBS特定功能的交互接口。

新手注意事项及解决方案

1. 环境配置问题

问题描述：新手安装插件后发现OBS Studio不识别或无法正常使用该插件。 解决步骤：

确保OBS版本兼容：检查你的OBS Studio版本是否支持此插件。官方包通常已包含此插件，但若手动安装，请从OBS Browser的GitHub页面确认其兼容性。
正确安装：下载最新版的.zip文件，解压后将整个目录复制到OBS Studio的“plugins”目录下。重启OBS Studio以加载插件。
查看日志：若问题依旧，检查OBS Studio的日志文件，它可能含有加载失败的具体原因。

2. 使用JavaScript绑定创建动态overlay遇到的困难

问题描述：尝试通过JavaScript控制OBS状态时遭遇障碍。 解决步骤：

引入全局对象：在你的网页代码中引入window.obsstudio对象来访问OBS特定功能。例如，获取插件版本，使用window.obsstudio.pluginVersion。

监听事件：使用addEventListener注册OBS事件，如obsSceneChanged，以便当场景变化时更新UI。示例代码如下：

window.addEventListener('obsSceneChanged', function(event) {
    var t = document.createTextNode(event.detail.name);
    document.body.appendChild(t);
});