@antmedia/web_player 2.12.0 → 2.12.1

package/dist/web_player.js

@@ -522,6 +522,24 @@ class WebPlayer {
      * It can be streamID or backupStreamId
      */
     _defineProperty(this, "activeStreamId", void 0);
+    // we define insertSecurityParameters in this way because we want to get the this context such as this.subscriberId
+    _defineProperty(this, "insertSecurityParameters", options => {
+      var queryParams = [];
+      if (!options.uri.includes("subscriberId") && this.subscriberId != null) {
+        queryParams.push("subscriberId=".concat(this.subscriberId));
+      }
+      if (!options.uri.includes("subscriberCode") && this.subscriberCode != null) {
+        queryParams.push("subscriberCode=".concat(this.subscriberCode));
+      }
+      if (!options.uri.includes("token") && this.token != null) {
+        queryParams.push("token=".concat(this.token));
+      }
+      if (queryParams.length > 0) {
+        var queryString = queryParams.join("&");
+        options.uri += options.uri.includes("?") ? "&".concat(queryString) : "?".concat(queryString);
+      }
+      Logger_1.debug("hls request: " + options.uri);
+    });
     WebPlayer.DEFAULT_PLAY_ORDER = ["webrtc", "hls"];
     WebPlayer.DEFAULT_PLAY_TYPE = ["mp4", "webm"];
     WebPlayer.HLS_EXTENSION = "m3u8";
@@ -724,12 +742,12 @@ class WebPlayer {
   }
   loadWebRTCComponents() {
     if (this.playOrder.includes("webrtc")) {
-      return Promise.resolve().then(function () { return require('./videojs-webrtc-plugin-5dd8808d.js'); }).then(css => {
+      return Promise.resolve().then(function () { return require('./videojs-webrtc-plugin-c8051dbf.js'); }).then(css => {
         Logger_1.info("videojs-webrtc-plugin.css is loaded");
         var styleElement = this.dom.createElement('style');
         styleElement.textContent = css.default.toString(); // Assuming css module exports a string
         this.dom.head.appendChild(styleElement);
-        return Promise.resolve().then(function () { return require('./videojs-webrtc-plugin.es-8f3aed93.js'); }).then(videojsWebrtcPluginLocal => {
+        return Promise.resolve().then(function () { return require('./videojs-webrtc-plugin.es-cf567f2d.js'); }).then(videojsWebrtcPluginLocal => {
           Logger_1.info("videojs-webrtc-plugin is loaded");
         });
       });
@@ -750,12 +768,12 @@ class WebPlayer {
           styleElement.textContent = css.default.toString(); // Assuming css module exports a string
           this.dom.head.appendChild(styleElement);
         }).then(() => {
-          return Promise.resolve().then(function () { return require('./video.es-df9af03d.js'); });
+          return Promise.resolve().then(function () { return require('./video.es-474303e7.js'); }).then(function (n) { return n.video_es; });
         }).then(videojs => {
           window.videojs = videojs.default;
           this.videojsLoaded = true;
         }).then(() => {
-          return Promise.resolve().then(function () { return require('./plugin-bec9dc4a.js'); });
+          return Promise.resolve().then(function () { return require('./plugin-1270024e.js'); });
         }).then(() => {
           return this.loadWebRTCComponents();
         });
@@ -821,10 +839,9 @@ class WebPlayer {
       }, 2000);
     } else if (infos["info"] == "streaming_started") {
       Logger_1.info("Requested stream has started");
-      this.playIfExists(this.currentPlayType, this.activeStreamId);
+      this.playIfExists(this.currentPlayType, infos["obj"].streamId);
     }
   }
-
   /**
    * Play the stream via videojs
    * @param {*} streamUrl
@@ -892,7 +909,14 @@ class WebPlayer {
         && errors["message"]["information"] == "stream_not_exist_or_not_streaming") {
           // server puts the this client to the waiting list automatically and it will notify with
           //streaming_started event
-          Logger_1.info("Stream does not exists or not started yet. Waiting for the stream to start. It will be notified with streaming_started event by the server");
+
+          //check if backup stream id is set
+          if (this.backupStreamId != null) {
+            this.tryNextTech();
+          } else {
+            //if backup stream id is not set, let the server notify
+            Logger_1.info("Stream " + errors["message"]["streamId"] + " does not exists or not started yet. Waiting for the stream to start. It will be notified with streaming_started event by the server");
+          }
         } else if (errors["error"] == "no_stream_exist" || errors["error"] == "WebSocketNotConnected" || errors["error"] == "not_initialized_yet" || errors["error"] == "data_store_not_available" || errors["error"] == "highResourceUsage" || errors["error"] == "unauthorized_access" || errors["error"] == "user_blocked") {
           //handle high resource usage and not authroized errors && websocket disconnected
           //Even if webrtc adaptor has auto reconnect scenario, we dispose the videojs immediately in tryNextTech
@@ -920,23 +944,12 @@ class WebPlayer {
 
     //hls specific calls
     if (extension == "m3u8") {
-      videojs.Vhs.xhr.onRequest = options => {
-        var queryParams = [];
-        if (!options.uri.includes("subscriberId") && this.subscriberId != null) {
-          queryParams.push("subscriberId=".concat(this.subscriberId));
-        }
-        if (!options.uri.includes("subscriberCode") && this.subscriberCode != null) {
-          queryParams.push("subscriberCode=".concat(this.subscriberCode));
-        }
-        if (!options.uri.includes("token") && this.token != null) {
-          queryParams.push("token=".concat(this.token));
-        }
-        if (queryParams.length > 0) {
-          var queryString = queryParams.join("&");
-          options.uri += options.uri.includes("?") ? "&".concat(queryString) : "?".concat(queryString);
-        }
-        Logger_1.debug("hls request: " + options.uri);
-      };
+      this.videojsPlayer.on('xhr-hooks-ready', () => {
+        this.videojsPlayer.ready(() => {
+          // tech is ready after ready event
+          this.videojsPlayer.tech().vhs.xhr.onRequest(this.insertSecurityParameters);
+        });
+      });
       this.videojsPlayer.ready(() => {
         // If it's already added to player, no need to add again
         if (typeof this.videojsPlayer.qualitySelectorHls === "function") {
@@ -1447,13 +1460,17 @@ class WebPlayer {
   getSecurityQueryParams() {
     var queryString = "";
     if (this.token != null) {
-      queryString += "&token=" + this.token;
+      queryString += "token=" + this.token + "&";
     }
     if (this.subscriberId != null) {
-      queryString += "&subscriberId=" + this.subscriberId;
+      queryString += "subscriberId=" + this.subscriberId + "&";
     }
     if (this.subscriberCode != null) {
-      queryString += "&subscriberCode=" + this.subscriberCode;
+      queryString += "subscriberCode=" + this.subscriberCode + "&";
+    }
+    //remove the last character if it's "&"
+    if (queryString.endsWith("&")) {
+      queryString = queryString.substring(0, queryString.length - 1);
     }
     return queryString;
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antmedia/web_player",
-  "version": "2.12.0",
+  "version": "2.12.1",
   "description": "Ant Media Server Player that can play WebRTC, HLS, DASH",
   "main": "dist/index.js",
   "module": "dist/es/index.js",

package/src/web_player.js

@@ -605,7 +605,7 @@ export class WebPlayer {
         else if (infos["info"] == "streaming_started") 
         {
             Logger.info("Requested stream has started");
-            this.playIfExists(this.currentPlayType, this.activeStreamId);
+            this.playIfExists(this.currentPlayType, infos["obj"].streamId);
         }
 	}
 
@@ -711,7 +711,15 @@ export class WebPlayer {
                 {
                     // server puts the this client to the waiting list automatically and it will notify with
                     //streaming_started event
-                    Logger.info("Stream does not exists or not started yet. Waiting for the stream to start. It will be notified with streaming_started event by the server");
+                    
+                    //check if backup stream id is set
+                    if (this.backupStreamId != null) {
+                        this.tryNextTech();
+                    }
+                    else {
+                        //if backup stream id is not set, let the server notify
+                         Logger.info("Stream "+errors["message"]["streamId"] +" does not exists or not started yet. Waiting for the stream to start. It will be notified with streaming_started event by the server");
+                    }
                 } 
                 else if (errors["error"] == "no_stream_exist" || errors["error"] == "WebSocketNotConnected"
 	                || errors["error"] == "not_initialized_yet" || errors["error"] == "data_store_not_available"

package/test/embedded-player.test.js

@@ -795,11 +795,14 @@ describe("WebPlayer", function() {
 	
 	it("handleWebRTCInfoMessages", async function() {
 
+		this.timeout(10000);
 		var videoContainer = document.createElement("video_container");
-
 		var placeHolder = document.createElement("place_holder");
+		document.body.appendChild(videoContainer);	
+		document.body.appendChild(placeHolder);	
 
-		var locationComponent = { href: 'http://example.com?id=stream123.mp4', search: "?id=stream123.mp4", pathname: "/", protocol: "http:"  };
+		var locationComponent = { href: 'http://example.com?id=stream123', 
+			search: "?id=stream123&playOrder=webrtc,hls,dash", pathname: "/", protocol: "http:"  };
 		var windowComponent = {
 			location: locationComponent,
 			document: document,
@@ -807,7 +810,14 @@ describe("WebPlayer", function() {
 		};
 
 		var player = new WebPlayer(windowComponent, videoContainer, placeHolder);
+		await player.initialize().then(()=> {
+				
+			}).catch((err) => {
+				expect.fail("it should not fail because we skip videojs and dash is already loaded");
+			});
+
 		var tryNextTech = sinon.replace(player, "tryNextTech", sinon.fake.returns(Promise.resolve("")));
+
 		var infos = {
 			info: "ice_connection_state_changed",
 			obj: {
@@ -836,7 +846,7 @@ describe("WebPlayer", function() {
 
 		expect(tryNextTech.calledTwice).to.be.true;
 		
-		await player.playIfExists("webrtc");
+		await player.playIfExists("webrtc", "streamId");
 
 		expect(player.videojsPlayer).to.not.be.null;
 		
@@ -862,17 +872,27 @@ describe("WebPlayer", function() {
 
 		infos = {
 			info: "streaming_started",
+			obj: {
+				streamId: "streamId"
+			}
 
 		}
 		player.handleWebRTCInfoMessages(infos);
 
 		expect(playIfExistsMethod.calledOnce).to.be.true;	
+
+		
+	
 	});
 
 	it("testAutoPlay",async function(){
 		var videoContainer = document.createElement("video_container");
-		  
+		
+		document.body.appendChild(videoContainer);	
 		var placeHolder = document.createElement("place_holder");
+		document.body.appendChild(placeHolder);	
+
+
 		  			
 		var locationComponent = { href: 'http://example.com?id=stream123.mp4', search: "?id=stream123.mp4", pathname: "/", protocol: "http:"  };
 		var windowComponent = {  location : locationComponent,