WebRTC: Add support for A/V only WHEP/WHEP player. v6.0.116 (#3964)

--------- Co-authored-by: john <hondaxiao@tencent.com>
ossrs · Mar 19, 2024 · 26f4ab9 · 26f4ab9
1 parent b891c8b
commit 26f4ab9
Show file tree

Hide file tree

Showing 6 changed files with 68 additions and 23 deletions.
diff --git a/trunk/doc/CHANGELOG.md b/trunk/doc/CHANGELOG.md
@@ -7,6 +7,7 @@ The changelog for SRS.
 <a name="v6-changes"></a>
 
 ## SRS 6.0 Changelog
+* v6.0, 2024-03-20, Merge [#3964](https://github.com/ossrs/srs/pull/3964): WebRTC: Add support for A/V only WHEP/WHEP player. v6.0.116 (#3964)
 * v6.0, 2024-03-19, Merge [#3990](https://github.com/ossrs/srs/pull/3990): System: Disable feature that obtains versions and check features status. v6.0.115 (#3990)
 * v6.0, 2024-03-18, Merge [#3973](https://github.com/ossrs/srs/pull/3973): Typo: Fix some typo for #3973 #3976 #3982. v6.0.114 (#3973)
 * v6.0, 2024-02-06, Merge [#3920](https://github.com/ossrs/srs/pull/3920): WHIP: Fix bug for converting WHIP to RTMP/HLS. v6.0.113 (#3920)

diff --git a/trunk/research/players/js/srs.sdk.js b/trunk/research/players/js/srs.sdk.js
@@ -526,11 +526,24 @@ function SrsRtcWhipWhepAsync() {
     // See https://datatracker.ietf.org/doc/draft-ietf-wish-whip/
     // @url The WebRTC url to publish with, for example:
     //      http://localhost:1985/rtc/v1/whip/?app=live&stream=livestream
-    self.publish = async function (url) {
+    // @options The options to control playing, supports:
+    //      videoOnly: boolean, whether only play video, default to false.
+    //      audioOnly: boolean, whether only play audio, default to false.
+    self.publish = async function (url, options) {
         if (url.indexOf('/whip/') === -1) throw new Error(`invalid WHIP url ${url}`);
+        if (options?.videoOnly && options?.audioOnly) throw new Error(`The videoOnly and audioOnly in options can't be true at the same time`);
 
-        self.pc.addTransceiver("audio", {direction: "sendonly"});
-        self.pc.addTransceiver("video", {direction: "sendonly"});
+        if (!options?.videoOnly) {
+            self.pc.addTransceiver("audio", {direction: "sendonly"});
+        } else {
+            self.constraints.audio = false;
+        }
+
+        if (!options?.audioOnly) {
+            self.pc.addTransceiver("video", {direction: "sendonly"});
+        } else {
+            self.constraints.video = false;
+        }
 
         if (!navigator.mediaDevices && window.location.protocol === 'http:' && window.location.hostname !== 'localhost') {
             throw new SrsError('HttpsRequiredError', `Please use HTTPS or localhost to publish, read https://github.com/ossrs/srs/issues/2762#issuecomment-983147576`);
@@ -548,7 +561,7 @@ function SrsRtcWhipWhepAsync() {
         var offer = await self.pc.createOffer();
         await self.pc.setLocalDescription(offer);
         const answer = await new Promise(function (resolve, reject) {
-            console.log("Generated offer: ", offer);
+            console.log(`Generated offer: ${offer.sdp}`);
 
             const xhr = new XMLHttpRequest();
             xhr.onload = function() {
@@ -572,16 +585,20 @@ function SrsRtcWhipWhepAsync() {
     // See https://datatracker.ietf.org/doc/draft-ietf-wish-whip/
     // @url The WebRTC url to play with, for example:
     //      http://localhost:1985/rtc/v1/whep/?app=live&stream=livestream
-    self.play = async function(url) {
+    // @options The options to control playing, supports:
+    //      videoOnly: boolean, whether only play video, default to false.
+    //      audioOnly: boolean, whether only play audio, default to false.
+    self.play = async function(url, options) {
         if (url.indexOf('/whip-play/') === -1 && url.indexOf('/whep/') === -1) throw new Error(`invalid WHEP url ${url}`);
+        if (options?.videoOnly && options?.audioOnly) throw new Error(`The videoOnly and audioOnly in options can't be true at the same time`);
 
-        self.pc.addTransceiver("audio", {direction: "recvonly"});
-        self.pc.addTransceiver("video", {direction: "recvonly"});
+        if (!options?.videoOnly) self.pc.addTransceiver("audio", {direction: "recvonly"});
+        if (!options?.audioOnly) self.pc.addTransceiver("video", {direction: "recvonly"});
 
         var offer = await self.pc.createOffer();
         await self.pc.setLocalDescription(offer);
         const answer = await new Promise(function(resolve, reject) {
-            console.log("Generated offer: ", offer);
+            console.log(`Generated offer: ${offer.sdp}`);
 
             const xhr = new XMLHttpRequest();
             xhr.onload = function() {

diff --git a/trunk/research/players/srs_player.html b/trunk/research/players/srs_player.html
@@ -242,11 +242,11 @@
             hlsPlayer = new Hls({
                 enableWorker: true, // Improve performance and avoid lag/frame drops.
                 lowLatencyMode: true, // Enable Low-Latency HLS part playlist and segment loading.
-                liveSyncDurationCount: 0, // Start from the last segment.
-                liveMaxLatencyDurationCount: 4, // Maximum delay allowed from edge of live.
-                maxBufferLength: 5, // Maximum buffer length in seconds.
-                maxMaxBufferLength: 8, // The max Maximum buffer length in seconds.
-                maxLiveSyncPlaybackRate: 2, // Catch up if the latency is large.
+                liveSyncDurationCount: 2, // Start from the last few segments.
+                liveMaxLatencyDurationCount: 10, // Maximum delay allowed from edge of live.
+                maxBufferLength: 8, // Maximum buffer length in seconds.
+                maxMaxBufferLength: 10, // The max Maximum buffer length in seconds.
+                maxLiveSyncPlaybackRate: 1.2, // Catch up if the latency is large.
                 liveDurationInfinity: true // Override current Media Source duration to Infinity for a live broadcast.
             });
             hlsPlayer.loadSource(r.url);

diff --git a/trunk/research/players/whep.html b/trunk/research/players/whep.html
@@ -55,13 +55,23 @@
         <button class="btn btn-primary" id="btn_play">Play</button>
     </div>
 
-    <label></label>
+    <p></p>
     <video id="rtc_media_player" controls autoplay></video>
 
-    <label></label>
+    <p></p>
+    <div class="form-inline">
+        Controls:
+        <label>
+            <input type="checkbox" id="ch_videoonly" style="margin-bottom: 8px"> Video Only
+        </label>
+        <label>
+            <input type="checkbox" id="ch_audioonly" style="margin-bottom: 8px"> Audio Only
+        </label>
+    </div>
+
     SessionID: <span id='sessionid'></span>
 
-    <label></label>
+    <p></p>
     Simulator: <a href='#' id='simulator-drop'>Drop</a>
 
     <footer>
@@ -89,7 +99,10 @@
 
         // For example: webrtc://r.ossrs.net/live/livestream
         var url = $("#txt_url").val();
-        sdk.play(url).then(function(session){
+        sdk.play(url, {
+            videoOnly: $('#ch_videoonly').prop('checked'),
+            audioOnly: $('#ch_audioonly').prop('checked'),
+        }).then(function(session){
             $('#sessionid').html(session.sessionid);
             $('#simulator-drop').attr('href', session.simulator + '?drop=1&username=' + session.sessionid);
         }).catch(function (reason) {

diff --git a/trunk/research/players/whip.html b/trunk/research/players/whip.html
@@ -55,17 +55,28 @@
         <button class="btn btn-primary" id="btn_publish">Publish</button>
     </div>
 
-    <label></label>
+    <p></p>
     <video id="rtc_media_player" width="320" autoplay muted></video>
 
-    <label></label>
+    <p></p>
+    <div class="form-inline">
+        Controls:
+        <label>
+            <input type="checkbox" id="ch_videoonly" style="margin-bottom: 8px"> Video Only
+        </label>
+        <label>
+            <input type="checkbox" id="ch_audioonly" style="margin-bottom: 8px"> Audio Only
+        </label>
+    </div>
+
+    <p></p>
     SessionID: <span id='sessionid'></span>
 
-    <label></label>
+    <p></p>
     Audio: <span id='acodecs'></span><br/>
     Video: <span id='vcodecs'></span>
 
-    <label></label>
+    <p></p>
     Simulator: <a href='#' id='simulator-drop'>Drop</a>
 
     <footer>
@@ -101,7 +112,10 @@
 
         // For example: webrtc://r.ossrs.net/live/livestream
         var url = $("#txt_url").val();
-        sdk.publish(url).then(function(session){
+        sdk.publish(url, {
+            videoOnly: $('#ch_videoonly').prop('checked'),
+            audioOnly: $('#ch_audioonly').prop('checked'),
+        }).then(function(session){
             $('#sessionid').html(session.sessionid);
             $('#simulator-drop').attr('href', session.simulator + '?drop=1&username=' + session.sessionid);
         }).catch(function (reason) {

diff --git a/trunk/src/core/srs_core_version6.hpp b/trunk/src/core/srs_core_version6.hpp
@@ -9,6 +9,6 @@
 
 #define VERSION_MAJOR       6
 #define VERSION_MINOR       0
-#define VERSION_REVISION    115
+#define VERSION_REVISION    116
 
 #endif