实时音视频
实时音视频
文档指南
请输入
- 文档首页
实时音视频实时音视频开发指南屏幕共享Web 端屏幕共享
复制全文
下载 pdfWeb 端屏幕共享
文档反馈
问问助手如果你希望让远端用户查看你的屏幕或窗口，你可以使用屏幕共享功能。
适用场景
你可以在多种行业的多种场景下使用到屏幕共享功能，例如，会议成员共享屏幕观看 ppt 或者文档。
前提条件
- 你已经集成 Web SDK，实现了基本的音视频通话。
- 浏览器版本要求
- Chrome 74 及以上版本
- Firefox 66 及以上版本
- Edge 99 及以上版本
- Safari 13 及以上版本
屏幕共享只能在 PC 端浏览器上实现，推荐使用 Chrome 最新版本。
功能实现
#{style="margin: auto"}#
#{style="margin: auto"}#【可选】设置屏幕流参数
若设置的参数浏览器不支持，RTC SDK 按照浏览器支持的参数范围进行采集和编码，并通过回调 onLocalVideoSizeChanged通知实际参数。
IRTCEngine.setScreenEncoderConfig({
width: 1920,
height: 1080,
frameRate: 15,
maxKbps: 3000,
// contentHint 仅在 Chrome 浏览器中能设置。
contentHint: 'detail'
});
参数设置注意事项
不同场景下建议的参数设置如下：
场景 | 分辨率（宽 x 高） | 帧率(fps) | 码率(kbps) | 备注 |
共享 PPT、Word 等静态文本。 | 1920 x 1080 | 5 | 2000 | |
共享动态内容，如视频、动画、游戏。 | 1920 x 1080 | 30 | 4000 | 为了保证分享效果，推荐分享网页标签页(Chrome Tab)。 |
在开启屏幕采集之后，参数只能下调，不能动态调整至更高参数。若要上调，则需重新采集。
开始采集和分享屏幕流
- 调用 startScreenCapture 开始屏幕采集
- 调用 publishScreen 开始发布屏幕流
await IRTCEngine.startScreenCapture({
enableAudio: true, // 共享屏幕时共享音频
});
await IRTCEngine.publishScreen(MediaType.AUDIO_AND_VIDEO);
- 停止发布屏幕流
await IRTCEngine.unpublishScreen(MediaType.AUDIO_AND_VIDEO);
订阅和播放屏幕流
- 监听到 onUserPublishScreen 事件后，调用 subscribeScreen 订阅屏幕流。
- 监听到 onUserPublishScreen 后，调用 setRemoteVideoPlayer 设置远端音视频流播放器。
IRTCEngine.on(IRTCEngine.events.onUserPublishScreen, async ({ userId, mediaType }) =>{
// 收到 `VERTC.events.onUserPublishScreen` 事件后订阅远端屏幕流
await IRTCEngine.subscribeScreen(userId, mediaType)
const player = $(`
<div id="player-wrapper-${userId}" class="player-wrapper re-player">
<p class="player-name">${userId}</p>
</div>
`);
$('#player-list').append(player);
IRTCEngine.setRemoteVideoPlayer(VERTC.StreamIndex.STREAM_INDEX_SCREEN,{
renderDom: `player-wrapper-${userId}`,
userId,
renderMode: VERTC.VideoRenderMode.RENDER_MODE_HIDDEN,
})
});
最近更新时间：2026.07.27 14:26:53
这个页面对您有帮助吗？
有用
有用
无用
无用