实时音视频
有奖捉虫：行业应用 & 管理与支持文档专题 HOT
文档中心 > 实时音视频 > 无 UI 集成 > 接入指引 > 06. 进阶指引 > 设定画面质量 > Web

Web

最近更新时间：2023-08-16 16:41:02

我的收藏

本页目录：

本文主要介绍如何在视频通话或互动直播中设置视频属性（包括分辨率、帧率和码率），开发者可以根据具体业务需求调整视频画面的清晰度和流畅度，获得更好的用户体验。
说明：
本教程基于 5.x TRTC Web SDK 实现，若您使用 4.x 版本 SDK，可参考此教程。
5.x 与 4.x 版本的区别。

设置分辨率、帧率、码率

通过 trtc 对象的 TRTC.startLocalVideo() 或 TRTC.updateLocalVideo() 方法设置视频属性：
指定一个预定义的 Profile，每个 Profile 对应着一套推荐的分辨率、帧率和码率。
// 启动时指定视频属性
await trtc.startLocalVideo({
    option: { profile: '480p' }
});
// 通话过程中动态调整视频属性
await trtc.updateLocalVideo({
    option: { profile: '360p' }
});
指定自定义分辨率、帧率和码率。
// 启动时指定视频属性
await trtc.startLocalVideo({
    option: { profile: { width: 640, height: 480, frameRate: 15, bitrate: 500 /* kpbs */} }
});
// 通话过程中动态调整视频属性
await trtc.updateLocalVideo({
    option: { profile: { width: 640, height: 360, frameRate: 15, bitrate: 400 /* kpbs */} }
});

设置清晰度优先、流畅度优先

在弱网下，TRTC 对于摄像头及屏幕分享有不同的编码策略。
对于摄像头，默认是流畅度优先。即在弱网时，会通过降低编码分辨率的方式，来优先保障编码帧率。
对于屏幕分享，默认是清晰度优先。即在弱网时，会通过降低编码帧率的方式，来优先保障编码分辨率。
若默认的编码策略不符合您的需求，您可以通过如下方式调整编码策略。
// 将摄像头改为清晰度优先
await trtc.startLocalVideo({
    option: { 
      qosPreference: TRTC.TYPE.QOS_PREFERENCE_CLEAR
    }
});

// 可以动态调整
await trtc.updateLocalVideo({
    option: { 
      qosPreference: TRTC.TYPE.QOS_PREFERENCE_SMOOTH
    }
});

// 将屏幕分享改为流畅度优先
await trtc.startScreenShare({
    option: { 
      qosPreference: TRTC.TYPE.QOS_PREFERENCE_SMOOTH
    }
})

// 可以动态调整
await trtc.updateScreenShare({
    option: { 
      qosPreference: TRTC.TYPE.QOS_PREFERENCE_CLEAR
    }
})

视频属性 Profile 列表

视频 Profile
分辨率（宽 x 高）
帧率（fps）
码率（kbps）
120p
160 x 120
15
200
180p
320 x 180
15
350
240p
320 x 240
15
400
360p
640 x 360
15
800
480p
640 x 480
15
900
720p
1280 x 720
15
1500
1080p
1920 x 1080
15
2000
1440p
2560 x 1440
30
4860
4K
3840 x 2160
30
9000
注意：
由于设备和浏览器的限制，视频分辨率不一定能够完全匹配，在这种情况下，浏览器会自动调整分辨率使其接近 Profile 对应的分辨率。

中国站