external/srs
1
0
Fork 0
mirror of https://github.com/ossrs/srs.git synced 2025-03-09 15:49:59 +00:00
Code Issues Releases Wiki Activity

RTC2RTMP: Fix screen sharing stutter caused by packet loss. v6.0.157 (#4160)

Browse source 
1. Refer this commit, which contains the web demo to capture screen as
video stream through RTC.
2. Copy the `trunk/research/players/whip.html` and
`trunk/research/players/js/srs.sdk.js` to replace the `develop` branch
source code.
3. `./configure && make`
4. `./objs/srs -c conf/rtc2rtmp.conf`
5. open `http://localhost:8080/players/whip.html?schema=http`
6. check `Screen` radio option.
7. click `publish`, then check the screen to share.
8. play the rtmp live stream: `rtmp://localhost/live/livestream`
9. check the video stuttering.

When capture screen by the chrome web browser, which send RTP packet
with empty payload frequently, then all the cached RTP packets are
dropped before next key frame arrive in this case.

The OBS screen stream and camera stream do not have such problem.

><img width="581" alt="Screenshot 2024-08-28 at 2 49 46 PM"
src="https://github.com/user-attachments/assets/9557dbd2-c799-4dfd-b336-5bbf2e4f8fb8">

---------

Co-authored-by: winlin <winlinvip@gmail.com>
This commit is contained in:
Jacob Su 2024-10-15 19:00:07 +08:00 • committed by winlin
parent b830d688be
commit 364bec264e
6 changed files with 65 additions and 19 deletions
Download patch file Download diff file Expand all files Collapse all files

15
trunk/research/players/whip.html
View file

@ -62,10 +62,16 @@
<div class="form-inline">
Controls:
<label>
<input type="checkbox" id="ch_videoonly" style="margin-bottom: 8px"> Video Only
<input type="radio" id="ra_camera" name="video" value="Camera" checked style="margin-bottom: 8px"> Camera
</label>
<label>
<input type="checkbox" id="ch_audioonly" style="margin-bottom: 8px"> Audio Only
<input type="radio" id="ra_screen" name="video" value="Screen" style="margin-bottom: 8px"> Screen
</label>
<label>
<input type="radio" id="ra_none" name="video" value="None" style="margin-bottom: 8px"> No Video
</label>
<label>
<input type="checkbox" id="ch_audio" checked style="margin-bottom: 8px"> Audio
</label>
</div>
@ -113,8 +119,9 @@ $(function(){
// For example: webrtc://r.ossrs.net/live/livestream
var url = $("#txt_url").val();
sdk.publish(url, {
videoOnly: $('#ch_videoonly').prop('checked'),
audioOnly: $('#ch_audioonly').prop('checked'),
camera: $('#ra_camera').prop('checked'),
screen: $('#ra_screen').prop('checked'),
audio: $('#ch_audio').prop('checked')
}).then(function(session){
$('#sessionid').html(session.sessionid);
$('#simulator-drop').attr('href', session.simulator + '?drop=1&username=' + session.sessionid);