欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

如何解决新版国标GB28181协议视频平台EasyGBS模块管理播放器弹出延时过高?

程序员文章站 2022-07-05 08:43:51
...

EasyGBS视频平台是支持国标GB28181协议的流媒体平台,旧版的EasyGBS设备管理在网页的左侧边栏,新版更新后,设备管理被移到了上侧导航栏,直接点击设备管理,就会出现所有接入的设备,点击播放弹出播放器框。

如何解决新版国标GB28181协议视频平台EasyGBS模块管理播放器弹出延时过高?

更新后,我们首次测试的时候在EasyGBS内点击设备管理的视频播放按钮,发现当服务器响应时间过长时,播放器弹框出现延迟过高,也就是在一段时间内,服务器没有响应。

如何解决新版国标GB28181协议视频平台EasyGBS模块管理播放器弹出延时过高?

我们设计的代码原理是,当点击播放操作后,发送请求获取到视频流地址后才会弹出播放框。这样就会导致当视频流正在传输时,服务器将会花费时间等待,视频流传输过来时,播放器才显示,并且直接播放视频。

解决这个问题,我们可以在点击播放操作后,先弹出播放框,然后再发送获取视频流的请求,这样当视频流正在传输时,播放器框也会显示,从而消除播放器弹框延时的问题。

以下为修改的代码,大家可以参考:

playStream(row) {
      this.$refs["videoDlg"].setPlayer();
      this.$set(row, "Locked", true);
      $.get("/api/v1/stream/start", {
        serial: row.DeviceID,
        code: row.ID,
      })
        .then((ret) => {
          var videoUrl = ret.WS_FLV;
          var videoUrlFlv = ret.FLV;
          var videoUrlRtmp = ret.RTMP;
          var videoUrlHls = ret.HLS;
          var videoUrlWsFlv = ret.WS_FLV;
          var VideoCode = ret.VideoCode;
          this.$refs["videoDlg"].play(
            videoUrl,
            row.Name || row.ID,
            row.SnapURL || "",
            row.DeviceID,
            row.ID,
            ret.RealtimeRecord,
            ret.StreamID,
            videoUrlFlv,
            videoUrlRtmp,
            videoUrlHls,
            videoUrlWsFlv,
            VideoCode
          );
        })
        .always(() => {
          this.$delete(row, "Locked");
        });
    },

 // 创建播放器
    setPlayer() {
      this.oldPlay = false;
      this.newPlay = true;
      this.new265Play = new WasmPlayer(
        null,
        "NewVideo",
        this.callbackfun,
        this,
        "auto",
        0
      );
      this.new265Play.startLoding()
      $(this.$el).modal("show");
    },

如何解决新版国标GB28181协议视频平台EasyGBS模块管理播放器弹出延时过高?