Browse Source

Merge branch '648540858:wvp-28181-2.0' into wvp-28181-2.0

pull/486/head
hotcoffie 3 years ago
committed by GitHub
parent
commit
3aa2665fb2
No known key found for this signature in database GPG Key ID: 4AEE18F83AFDEB23
  1. 24
      src/main/java/com/genersoft/iot/vmp/conf/MediaConfig.java
  2. 2
      src/main/java/com/genersoft/iot/vmp/gb28181/transmit/event/request/impl/RegisterRequestProcessor.java
  3. 32
      src/main/java/com/genersoft/iot/vmp/gb28181/transmit/event/request/impl/message/notify/cmd/KeepaliveNotifyMessageHandler.java
  4. 10
      src/main/java/com/genersoft/iot/vmp/gb28181/transmit/event/request/impl/message/response/cmd/RecordInfoResponseMessageHandler.java
  5. 36
      src/main/java/com/genersoft/iot/vmp/service/impl/PlayServiceImpl.java
  6. 4
      web_src/src/components/channelList.vue
  7. 86
      web_src/src/components/dialog/devicePlayer.vue
  8. 222
      web_src/static/js/ZLMRTCClient.js
  9. 1
      web_src/static/js/ZLMRTCClient.js.map
  10. 2
      web_src/static/js/jessibuca/decoder.js
  11. BIN
      web_src/static/js/jessibuca/decoder.wasm
  12. 637
      web_src/static/js/jessibuca/jessibuca.d.ts
  13. 2
      web_src/static/js/jessibuca/jessibuca.js

24
src/main/java/com/genersoft/iot/vmp/conf/MediaConfig.java

@ -6,6 +6,10 @@ import org.springframework.beans.factory.annotation.Value;
import org.springframework.context.annotation.Configuration; import org.springframework.context.annotation.Configuration;
import org.springframework.util.StringUtils; import org.springframework.util.StringUtils;
import java.net.InetAddress;
import java.net.UnknownHostException;
import java.util.regex.Pattern;
@Configuration("mediaConfig") @Configuration("mediaConfig")
public class MediaConfig{ public class MediaConfig{
@ -161,7 +165,18 @@ public class MediaConfig{
if (StringUtils.isEmpty(sdpIp)){ if (StringUtils.isEmpty(sdpIp)){
return ip; return ip;
}else { }else {
return sdpIp; if (isValidIPAddress(sdpIp)) {
return sdpIp;
}else {
// 按照域名解析
String hostAddress = null;
try {
hostAddress = InetAddress.getByName(sdpIp).getHostAddress();
} catch (UnknownHostException e) {
throw new RuntimeException(e);
}
return hostAddress;
}
} }
} }
@ -211,4 +226,11 @@ public class MediaConfig{
return mediaServerItem; return mediaServerItem;
} }
private boolean isValidIPAddress(String ipAddress) {
if ((ipAddress != null) && (!ipAddress.isEmpty())) {
return Pattern.matches("^([1-9]|[1-9]\\d|1\\d{2}|2[0-4]\\d|25[0-5])(\\.(\\d|[1-9]\\d|1\\d{2}|2[0-4]\\d|25[0-5])){3}$", ipAddress);
}
return false;
}
} }

2
src/main/java/com/genersoft/iot/vmp/gb28181/transmit/event/request/impl/RegisterRequestProcessor.java

@ -94,7 +94,7 @@ public class RegisterRequestProcessor extends SIPRequestProcessorParent implemen
String deviceId = uri.getUser(); String deviceId = uri.getUser();
AuthorizationHeader authHead = (AuthorizationHeader) request.getHeader(AuthorizationHeader.NAME); AuthorizationHeader authHead = (AuthorizationHeader) request.getHeader(AuthorizationHeader.NAME);
if (authHead == null) { if (authHead == null && !StringUtils.isEmpty(sipConfig.getPassword())) {
logger.info("[注册请求] 未携带授权头 回复401: {}", requestAddress); logger.info("[注册请求] 未携带授权头 回复401: {}", requestAddress);
response = getMessageFactory().createResponse(Response.UNAUTHORIZED, request); response = getMessageFactory().createResponse(Response.UNAUTHORIZED, request);
new DigestServerAuthenticationHelper().generateChallenge(getHeaderFactory(), response, sipConfig.getDomain()); new DigestServerAuthenticationHelper().generateChallenge(getHeaderFactory(), response, sipConfig.getDomain());

32
src/main/java/com/genersoft/iot/vmp/gb28181/transmit/event/request/impl/message/notify/cmd/KeepaliveNotifyMessageHandler.java

@ -49,28 +49,28 @@ public class KeepaliveNotifyMessageHandler extends SIPRequestProcessorParent imp
return; return;
} }
try { try {
// 判断RPort是否改变,改变则说明路由nat信息变化,修改设备信息
// 获取到通信地址等信息
ViaHeader viaHeader = (ViaHeader) evt.getRequest().getHeader(ViaHeader.NAME);
String received = viaHeader.getReceived();
int rPort = viaHeader.getRPort();
// 解析本地地址替代
if (StringUtils.isEmpty(received) || rPort == -1) {
received = viaHeader.getHost();
rPort = viaHeader.getPort();
}
if (device.getPort() != rPort) {
device.setPort(rPort);
device.setHostAddress(received.concat(":").concat(String.valueOf(rPort)));
}
device.setKeepaliveTime(DateUtil.getNow());
if (device.getOnline() == 1) { if (device.getOnline() == 1) {
// 回复200 OK // 回复200 OK
responseAck(evt, Response.OK); responseAck(evt, Response.OK);
deviceService.updateDevice(device);
}else { }else {
// 对于已经离线的设备判断他的注册是否已经过期 // 对于已经离线的设备判断他的注册是否已经过期
if (!deviceService.expire(device)){ if (!deviceService.expire(device)){
device.setKeepaliveTime(DateUtil.getNow());
// 判断RPort是否改变,改变则说明路由nat信息变化,修改设备信息
// 获取到通信地址等信息
ViaHeader viaHeader = (ViaHeader) evt.getRequest().getHeader(ViaHeader.NAME);
String received = viaHeader.getReceived();
int rPort = viaHeader.getRPort();
// 解析本地地址替代
if (StringUtils.isEmpty(received) || rPort == -1) {
received = viaHeader.getHost();
rPort = viaHeader.getPort();
}
if (device.getPort() != rPort) {
device.setPort(rPort);
device.setHostAddress(received.concat(":").concat(String.valueOf(rPort)));
}
device.setKeepaliveTime(DateUtil.getNow());
deviceService.online(device); deviceService.online(device);
// 回复200 OK // 回复200 OK
responseAck(evt, Response.OK); responseAck(evt, Response.OK);

10
src/main/java/com/genersoft/iot/vmp/gb28181/transmit/event/request/impl/message/response/cmd/RecordInfoResponseMessageHandler.java

@ -70,15 +70,20 @@ public class RecordInfoResponseMessageHandler extends SIPRequestProcessorParent
rootElement = getRootElement(evt, device.getCharset()); rootElement = getRootElement(evt, device.getCharset());
String sn = getText(rootElement, "SN"); String sn = getText(rootElement, "SN");
RecordInfo recordInfo = new RecordInfo();
recordInfo.setDeviceId(device.getDeviceId());
recordInfo.setSn(sn);
recordInfo.setName(getText(rootElement, "Name"));
String sumNumStr = getText(rootElement, "SumNum"); String sumNumStr = getText(rootElement, "SumNum");
int sumNum = 0; int sumNum = 0;
if (!StringUtils.isEmpty(sumNumStr)) { if (!StringUtils.isEmpty(sumNumStr)) {
sumNum = Integer.parseInt(sumNumStr); sumNum = Integer.parseInt(sumNumStr);
} }
recordInfo.setSumNum(sumNum);
Element recordListElement = rootElement.element("RecordList"); Element recordListElement = rootElement.element("RecordList");
if (recordListElement == null || sumNum == 0) { if (recordListElement == null || sumNum == 0) {
logger.info("无录像数据"); logger.info("无录像数据");
eventPublisher.recordEndEventPush(recordInfo);
recordDataCatch.put(device.getDeviceId(), sn, sumNum, new ArrayList<>()); recordDataCatch.put(device.getDeviceId(), sn, sumNum, new ArrayList<>());
releaseRequest(device.getDeviceId(), sn); releaseRequest(device.getDeviceId(), sn);
} else { } else {
@ -112,6 +117,9 @@ public class RecordInfoResponseMessageHandler extends SIPRequestProcessorParent
record.setRecorderId(getText(itemRecord, "RecorderID")); record.setRecorderId(getText(itemRecord, "RecorderID"));
recordList.add(record); recordList.add(record);
} }
recordInfo.setRecordList(recordList);
// 发送消息,如果是上级查询此录像,则会通过这里通知给上级
eventPublisher.recordEndEventPush(recordInfo);
int count = recordDataCatch.put(device.getDeviceId(), sn, sumNum, recordList); int count = recordDataCatch.put(device.getDeviceId(), sn, sumNum, recordList);
logger.info("[国标录像], {}->{}: {}/{}", device.getDeviceId(), sn, count, sumNum); logger.info("[国标录像], {}->{}: {}/{}", device.getDeviceId(), sn, count, sumNum);
} }

36
src/main/java/com/genersoft/iot/vmp/service/impl/PlayServiceImpl.java

@ -87,6 +87,9 @@ public class PlayServiceImpl implements IPlayService {
@Autowired @Autowired
private DynamicTask dynamicTask; private DynamicTask dynamicTask;
@Autowired
private ZLMHttpHookSubscribe subscribe;
@ -256,6 +259,7 @@ public class PlayServiceImpl implements IPlayService {
} }
}, userSetting.getPlayTimeout()*1000); }, userSetting.getPlayTimeout()*1000);
final String ssrc = ssrcInfo.getSsrc(); final String ssrc = ssrcInfo.getSsrc();
final String stream = ssrcInfo.getStream();
cmder.playStreamCmd(mediaServerItem, ssrcInfo, device, channelId, (MediaServerItem mediaServerItemInuse, JSONObject response) -> { cmder.playStreamCmd(mediaServerItem, ssrcInfo, device, channelId, (MediaServerItem mediaServerItemInuse, JSONObject response) -> {
logger.info("收到订阅消息: " + response.toJSONString()); logger.info("收到订阅消息: " + response.toJSONString());
dynamicTask.stop(timeOutTaskKey); dynamicTask.stop(timeOutTaskKey);
@ -271,9 +275,13 @@ public class PlayServiceImpl implements IPlayService {
if (ssrcIndex >= 0) { if (ssrcIndex >= 0) {
//ssrc规定长度为10字节,不取余下长度以避免后续还有“f=”字段 TODO 后续对不规范的非10位ssrc兼容 //ssrc规定长度为10字节,不取余下长度以避免后续还有“f=”字段 TODO 后续对不规范的非10位ssrc兼容
String ssrcInResponse = contentString.substring(ssrcIndex + 2, ssrcIndex + 12); String ssrcInResponse = contentString.substring(ssrcIndex + 2, ssrcIndex + 12);
if (!ssrc.equals(ssrcInResponse) && device.isSsrcCheck()) { // 查询到ssrc不一致且开启了ssrc校验则需要针对处理 // 查询到ssrc不一致且开启了ssrc校验则需要针对处理
// 查询 ssrcInResponse 是否可用 if (ssrc.equals(ssrcInResponse)) {
if (mediaServerItem.isRtpEnable() && !mediaServerItem.getSsrcConfig().checkSsrc(ssrcInResponse)) { return;
}
logger.info("[SIP 消息] 收到invite 200, 发现下级自定义了ssrc 开启修正");
if (!mediaServerItem.isRtpEnable() || device.isSsrcCheck()) {
if (!mediaServerItem.getSsrcConfig().checkSsrc(ssrcInResponse)) {
// ssrc 不可用 // ssrc 不可用
// 释放ssrc // 释放ssrc
mediaServerService.releaseSsrc(mediaServerItem.getId(), finalSsrcInfo.getSsrc()); mediaServerService.releaseSsrc(mediaServerItem.getId(), finalSsrcInfo.getSsrc());
@ -283,10 +291,32 @@ public class PlayServiceImpl implements IPlayService {
errorEvent.response(event); errorEvent.response(event);
return; return;
} }
// 单端口模式streamId也有变化,需要重新设置监听
if (!mediaServerItem.isRtpEnable()) {
// 添加订阅
JSONObject subscribeKey = new JSONObject();
subscribeKey.put("app", "rtp");
subscribeKey.put("stream", stream);
subscribeKey.put("regist", true);
subscribeKey.put("schema", "rtmp");
subscribeKey.put("mediaServerId", mediaServerItem.getId());
subscribe.removeSubscribe(ZLMHttpHookSubscribe.HookType.on_stream_changed,subscribeKey);
subscribeKey.put("stream", String.format("%08x", Integer.parseInt(ssrcInResponse)).toUpperCase());
subscribe.addSubscribe(ZLMHttpHookSubscribe.HookType.on_stream_changed, subscribeKey,
(MediaServerItem mediaServerItemInUse, JSONObject response)->{
logger.info("[ZLM HOOK] ssrc修正后收到订阅消息: " + response.toJSONString());
dynamicTask.stop(timeOutTaskKey);
// hook响应
onPublishHandlerForPlay(mediaServerItemInUse, response, device.getDeviceId(), channelId, uuid);
hookEvent.response(mediaServerItemInUse, response);
});
}
// 关闭rtp server // 关闭rtp server
mediaServerService.closeRTPServer(device.getDeviceId(), channelId, finalSsrcInfo.getStream()); mediaServerService.closeRTPServer(device.getDeviceId(), channelId, finalSsrcInfo.getStream());
// 重新开启ssrc server // 重新开启ssrc server
mediaServerService.openRTPServer(mediaServerItem, finalSsrcInfo.getStream(), ssrcInResponse, device.isSsrcCheck(), false); mediaServerService.openRTPServer(mediaServerItem, finalSsrcInfo.getStream(), ssrcInResponse, device.isSsrcCheck(), false);
} }
} }
}, (event) -> { }, (event) -> {

4
web_src/src/components/channelList.vue

@ -220,6 +220,7 @@ export default {
method: 'get', method: 'get',
url: '/api/play/start/' + deviceId + '/' + channelId url: '/api/play/start/' + deviceId + '/' + channelId
}).then(function (res) { }).then(function (res) {
console.log(res)
that.isLoging = false; that.isLoging = false;
if (res.data.code === 0) { if (res.data.code === 0) {
@ -241,8 +242,9 @@ export default {
that.$message.error(res.data.msg); that.$message.error(res.data.msg);
} }
}).catch(function (e) { }).catch(function (e) {
console.error(e)
that.isLoging = false; that.isLoging = false;
that.$message.error("请求超时"); // that.$message.error("");
}); });
}, },
queryRecords: function (itemData) { queryRecords: function (itemData) {

86
web_src/src/components/dialog/devicePlayer.vue

@ -4,10 +4,22 @@
<el-dialog title="视频播放" top="0" :close-on-click-modal="false" :visible.sync="showVideoDialog" @close="close()"> <el-dialog title="视频播放" top="0" :close-on-click-modal="false" :visible.sync="showVideoDialog" @close="close()">
<!-- <LivePlayer v-if="showVideoDialog" ref="videoPlayer" :videoUrl="videoUrl" :error="videoError" :message="videoError" :hasaudio="hasaudio" fluent autoplay live></LivePlayer> --> <!-- <LivePlayer v-if="showVideoDialog" ref="videoPlayer" :videoUrl="videoUrl" :error="videoError" :message="videoError" :hasaudio="hasaudio" fluent autoplay live></LivePlayer> -->
<div style="width: 100%; height: 100%"> <div style="width: 100%; height: 100%">
<player ref="videoPlayer" :visible.sync="showVideoDialog" :videoUrl="videoUrl" :error="videoError" :message="videoError" height="100px" :hasAudio="hasAudio" fluent autoplay live ></player> <el-tabs type="card" :stretch="true" v-model="activePlayer" @tab-click="changePlayer" v-if="Object.keys(this.player).length > 1">
<el-tab-pane label="Jessibuca" name="jessibuca">
<jessibucaPlayer v-if="activePlayer === 'jessibuca'" ref="jessibuca" :visible.sync="showVideoDialog" :videoUrl="videoUrl" :error="videoError" :message="videoError" height="100px" :hasAudio="hasAudio" fluent autoplay live ></jessibucaPlayer>
</el-tab-pane>
<el-tab-pane label="WebRTC" name="webRTC">
<rtc-player v-if="activePlayer === 'webRTC'" ref="webRTC" :visible.sync="showVideoDialog" :videoUrl="videoUrl" :error="videoError" :message="videoError" height="100px" :hasAudio="hasAudio" fluent autoplay live ></rtc-player>
</el-tab-pane>
<el-tab-pane label="h265web">h265web敬请期待</el-tab-pane>
<el-tab-pane label="wsPlayer">wsPlayer 敬请期待</el-tab-pane>
</el-tabs>
<jessibucaPlayer v-if="Object.keys(this.player).length == 1 && this.player.jessibuca" ref="jessibuca" :visible.sync="showVideoDialog" :videoUrl="videoUrl" :error="videoError" :message="videoError" height="100px" :hasAudio="hasAudio" fluent autoplay live ></jessibucaPlayer>
<rtc-player v-if="Object.keys(this.player).length == 1 && this.player.webRTC" ref="jessibuca" :visible.sync="showVideoDialog" :videoUrl="videoUrl" :error="videoError" :message="videoError" height="100px" :hasAudio="hasAudio" fluent autoplay live ></rtc-player>
</div> </div>
<div id="shared" style="text-align: right; margin-top: 1rem;"> <div id="shared" style="text-align: right; margin-top: 1rem;">
<el-tabs v-model="tabActiveName" @tab-click="tabHandleClick"> <el-tabs v-model="tabActiveName" @tab-click="tabHandleClick" >
<el-tab-pane label="实时视频" name="media"> <el-tab-pane label="实时视频" name="media">
<div style="margin-bottom: 0.5rem;"> <div style="margin-bottom: 0.5rem;">
<!-- <el-button type="primary" size="small" @click="playRecord(true, '')">播放</el-button>--> <!-- <el-button type="primary" size="small" @click="playRecord(true, '')">播放</el-button>-->
@ -273,16 +285,16 @@
</template> </template>
<script> <script>
// import player from '../dialog/rtcPlayer.vue' import rtcPlayer from '../dialog/rtcPlayer.vue'
// import LivePlayer from '@liveqing/liveplayer' // import LivePlayer from '@liveqing/liveplayer'
// import player from '../dialog/easyPlayer.vue' // import player from '../dialog/easyPlayer.vue'
import player from '../common/jessibuca.vue' import jessibucaPlayer from '../common/jessibuca.vue'
import recordDownload from '../dialog/recordDownload.vue' import recordDownload from '../dialog/recordDownload.vue'
export default { export default {
name: 'devicePlayer', name: 'devicePlayer',
props: {}, props: {},
components: { components: {
player,recordDownload, jessibucaPlayer, rtcPlayer, recordDownload,
}, },
computed: { computed: {
getPlayerShared: function () { getPlayerShared: function () {
@ -293,11 +305,22 @@ export default {
}; };
} }
}, },
created() {}, created() {
console.log(this.player)
if (Object.keys(this.player).length === 1) {
this.activePlayer = Object.keys(this.player)[0]
}
},
data() { data() {
return { return {
video: 'http://lndxyj.iqilu.com/public/upload/2019/10/14/8c001ea0c09cdc59a57829dabc8010fa.mp4', video: 'http://lndxyj.iqilu.com/public/upload/2019/10/14/8c001ea0c09cdc59a57829dabc8010fa.mp4',
videoUrl: '', videoUrl: '',
activePlayer: "jessibuca",
//
player: {
jessibuca : ["ws_flv", "wss_flv"],
webRTC: ["rtc", "rtc"],
},
videoHistory: { videoHistory: {
date: '', date: '',
searchHistoryResult: [] // searchHistoryResult: [] //
@ -364,6 +387,12 @@ export default {
}).catch(function (e) {}); }).catch(function (e) {});
} }
}, },
changePlayer: function (tab) {
console.log(this.player[tab.name][0])
this.activePlayer = tab.name;
this.videoUrl = this.streamInfo[this.player[tab.name][0]]
console.log(this.videoUrl)
},
openDialog: function (tab, deviceId, channelId, param) { openDialog: function (tab, deviceId, channelId, param) {
this.tabActiveName = tab; this.tabActiveName = tab;
this.channelId = channelId; this.channelId = channelId;
@ -372,8 +401,8 @@ export default {
this.mediaServerId = ""; this.mediaServerId = "";
this.app = ""; this.app = "";
this.videoUrl = "" this.videoUrl = ""
if (!!this.$refs.videoPlayer) { if (!!this.$refs[this.activePlayer]) {
this.$refs.videoPlayer.pause(); this.$refs[this.activePlayer].pause();
} }
switch (tab) { switch (tab) {
case "media": case "media":
@ -402,38 +431,25 @@ export default {
this.hasAudio = hasAudio; this.hasAudio = hasAudio;
this.isLoging = false; this.isLoging = false;
// this.videoUrl = streamInfo.rtc; // this.videoUrl = streamInfo.rtc;
this.videoUrl = this.getUrlByStreamInfo(streamInfo); this.videoUrl = this.getUrlByStreamInfo();
this.streamId = streamInfo.stream; this.streamId = streamInfo.stream;
this.app = streamInfo.app; this.app = streamInfo.app;
this.mediaServerId = streamInfo.mediaServerId; this.mediaServerId = streamInfo.mediaServerId;
this.playFromStreamInfo(false, streamInfo) this.playFromStreamInfo(false, streamInfo)
}, },
getUrlByStreamInfo(streamInfo){ getUrlByStreamInfo(){
let baseZlmApi = process.env.NODE_ENV === 'development'?`${location.host}/debug/zlm`:`${location.host}/zlm`
// return `${baseZlmApi}/${streamInfo.app}/${streamInfo.streamId}.flv`;
// return `http://${baseZlmApi}/${streamInfo.app}/${streamInfo.streamId}.flv`;
if (location.protocol === "https:") { if (location.protocol === "https:") {
if (streamInfo.wss_flv === null) { this.videoUrl = this.streamInfo[this.player[this.activePlayer][1]]
console.error("媒体服务器未配置ssl端口, 使用http端口")
// this.$message({
// showClose: true,
// message: 'ssl, ',
// type: 'error'
// });
return streamInfo.ws_flv
}else {
return streamInfo.wss_flv;
}
}else { }else {
return streamInfo.ws_flv; this.videoUrl = this.streamInfo[this.player[this.activePlayer][0]]
} }
return this.videoUrl;
}, },
coverPlay: function () { coverPlay: function () {
var that = this; var that = this;
this.coverPlaying = true; this.coverPlaying = true;
this.$refs.videoPlayer.pause() this.$refs[this.activePlayer].pause()
that.$axios({ that.$axios({
method: 'post', method: 'post',
url: '/api/gb_record/convert/' + that.streamId url: '/api/gb_record/convert/' + that.streamId
@ -465,7 +481,7 @@ export default {
}, },
convertStopClick: function() { convertStopClick: function() {
this.convertStop(()=>{ this.convertStop(()=>{
this.$refs.videoPlayer.play(this.videoUrl) this.$refs[this.activePlayer].play(this.videoUrl)
}); });
}, },
convertStop: function(callback) { convertStop: function(callback) {
@ -490,12 +506,12 @@ export default {
playFromStreamInfo: function (realHasAudio, streamInfo) { playFromStreamInfo: function (realHasAudio, streamInfo) {
this.showVideoDialog = true; this.showVideoDialog = true;
this.hasaudio = realHasAudio && this.hasaudio; this.hasaudio = realHasAudio && this.hasaudio;
this.$refs.videoPlayer.play(this.getUrlByStreamInfo(streamInfo)) this.$refs[this.activePlayer].play(this.getUrlByStreamInfo(streamInfo))
}, },
close: function () { close: function () {
console.log('关闭视频'); console.log('关闭视频');
if (!!this.$refs.videoPlayer){ if (!!this.$refs[this.activePlayer]){
this.$refs.videoPlayer.pause(); this.$refs[this.activePlayer].pause();
} }
this.videoUrl = ''; this.videoUrl = '';
this.coverPlaying = false; this.coverPlaying = false;
@ -600,7 +616,7 @@ export default {
} }
}, },
stopPlayRecord: function (callback) { stopPlayRecord: function (callback) {
this.$refs.videoPlayer.pause(); this.$refs[this.activePlayer].pause();
this.videoUrl = ''; this.videoUrl = '';
this.$axios({ this.$axios({
method: 'get', method: 'get',
@ -646,7 +662,7 @@ export default {
} }
}, },
stopDownloadRecord: function (callback) { stopDownloadRecord: function (callback) {
this.$refs.videoPlayer.pause(); this.$refs[this.activePlayer].pause();
this.videoUrl = ''; this.videoUrl = '';
this.$axios({ this.$axios({
method: 'get', method: 'get',
@ -753,7 +769,7 @@ export default {
method: 'get', method: 'get',
url: '/api/playback/resume/' + this.streamId url: '/api/playback/resume/' + this.streamId
}).then((res)=> { }).then((res)=> {
this.$refs.videoPlayer.play(this.videoUrl) this.$refs[this.activePlayer].play(this.videoUrl)
}); });
}, },
gbPause(){ gbPause(){
@ -784,7 +800,7 @@ export default {
url: `/api/playback/seek/${this.streamId }/` + Math.floor(this.seekTime * val / 100000) url: `/api/playback/seek/${this.streamId }/` + Math.floor(this.seekTime * val / 100000)
}).then( (res)=> { }).then( (res)=> {
setTimeout(()=>{ setTimeout(()=>{
this.$refs.videoPlayer.play(this.videoUrl) this.$refs[this.activePlayer].play(this.videoUrl)
}, 600) }, 600)
}); });
}, },

222
web_src/static/js/ZLMRTCClient.js

@ -6,11 +6,17 @@ var ZLMRTCClient = (function (exports) {
WEBRTC_ICE_CANDIDATE_ERROR: 'WEBRTC_ICE_CANDIDATE_ERROR', WEBRTC_ICE_CANDIDATE_ERROR: 'WEBRTC_ICE_CANDIDATE_ERROR',
WEBRTC_OFFER_ANWSER_EXCHANGE_FAILED: 'WEBRTC_OFFER_ANWSER_EXCHANGE_FAILED', WEBRTC_OFFER_ANWSER_EXCHANGE_FAILED: 'WEBRTC_OFFER_ANWSER_EXCHANGE_FAILED',
WEBRTC_ON_REMOTE_STREAMS: 'WEBRTC_ON_REMOTE_STREAMS', WEBRTC_ON_REMOTE_STREAMS: 'WEBRTC_ON_REMOTE_STREAMS',
WEBRTC_ON_LOCAL_STREAM: 'WEBRTC_ON_LOCAL_STREAM' WEBRTC_ON_LOCAL_STREAM: 'WEBRTC_ON_LOCAL_STREAM',
WEBRTC_ON_CONNECTION_STATE_CHANGE: 'WEBRTC_ON_CONNECTION_STATE_CHANGE',
WEBRTC_ON_DATA_CHANNEL_OPEN: 'WEBRTC_ON_DATA_CHANNEL_OPEN',
WEBRTC_ON_DATA_CHANNEL_CLOSE: 'WEBRTC_ON_DATA_CHANNEL_CLOSE',
WEBRTC_ON_DATA_CHANNEL_ERR: 'WEBRTC_ON_DATA_CHANNEL_ERR',
WEBRTC_ON_DATA_CHANNEL_MSG: 'WEBRTC_ON_DATA_CHANNEL_MSG',
CAPTURE_STREAM_FAILED: 'CAPTURE_STREAM_FAILED'
}; };
const VERSION = '1.0.1'; const VERSION = '1.0.1';
const BUILD_DATE = 'Mon Apr 05 2021 10:22:48 GMT+0800 (中国标准时间)'; const BUILD_DATE = 'Thu Mar 24 2022 17:42:57 GMT+0800 (China Standard Time)';
// Copyright (C) <2018> Intel Corporation // Copyright (C) <2018> Intel Corporation
// //
@ -7284,11 +7290,16 @@ var ZLMRTCClient = (function (exports) {
debug: false, debug: false,
// if output debug log // if output debug log
zlmsdpUrl: '', zlmsdpUrl: '',
simulecast: false, simulcast: false,
useCamera: true, useCamera: true,
audioEnable: true, audioEnable: true,
videoEnable: true, videoEnable: true,
recvOnly: false recvOnly: false,
resolution: {
w: 0,
h: 0
},
usedatachannel: false
}; };
this.options = Object.assign({}, defaults, options); this.options = Object.assign({}, defaults, options);
@ -7299,7 +7310,12 @@ var ZLMRTCClient = (function (exports) {
this.e = { this.e = {
onicecandidate: this._onIceCandidate.bind(this), onicecandidate: this._onIceCandidate.bind(this),
ontrack: this._onTrack.bind(this), ontrack: this._onTrack.bind(this),
onicecandidateerror: this._onIceCandidateError.bind(this) onicecandidateerror: this._onIceCandidateError.bind(this),
onconnectionstatechange: this._onconnectionstatechange.bind(this),
ondatachannelopen: this._onDataChannelOpen.bind(this),
ondatachannelmsg: this._onDataChannelMsg.bind(this),
ondatachannelerr: this._onDataChannelErr.bind(this),
ondatachannelclose: this._onDataChannelClose.bind(this)
}; };
this._remoteStream = null; this._remoteStream = null;
this._localStream = null; this._localStream = null;
@ -7307,6 +7323,17 @@ var ZLMRTCClient = (function (exports) {
this.pc.onicecandidate = this.e.onicecandidate; this.pc.onicecandidate = this.e.onicecandidate;
this.pc.onicecandidateerror = this.e.onicecandidateerror; this.pc.onicecandidateerror = this.e.onicecandidateerror;
this.pc.ontrack = this.e.ontrack; this.pc.ontrack = this.e.ontrack;
this.pc.onconnectionstatechange = this.e.onconnectionstatechange;
this.datachannel = null;
if (this.options.usedatachannel) {
this.datachannel = this.pc.createDataChannel('chat');
this.datachannel.onclose = this.e.ondatachannelclose;
this.datachannel.onerror = this.e.ondatachannelerr;
this.datachannel.onmessage = this.e.ondatachannelmsg;
this.datachannel.onopen = this.e.ondatachannelopen;
}
if (!this.options.recvOnly && (this.options.audioEnable || this.options.videoEnable)) this.start();else this.receive(); if (!this.options.recvOnly && (this.options.audioEnable || this.options.videoEnable)) this.start();else this.receive();
} }
@ -7347,7 +7374,7 @@ var ZLMRTCClient = (function (exports) {
anwser.type = 'answer'; anwser.type = 'answer';
log(this.TAG, 'answer:', ret.sdp); log(this.TAG, 'answer:', ret.sdp);
this.pc.setRemoteDescription(anwser).then(() => { this.pc.setRemoteDescription(anwser).then(() => {
log(this.TAG, 'set remote success'); log(this.TAG, 'set remote sucess');
}).catch(e => { }).catch(e => {
error(this.TAG, e); error(this.TAG, e);
}); });
@ -7377,6 +7404,10 @@ var ZLMRTCClient = (function (exports) {
} }
} }
if (this.options.resolution.w != 0 && this.options.resolution.h != 0 && typeof videoConstraints == 'object') {
videoConstraints.resolution = new Resolution(this.options.resolution.w, this.options.resolution.h);
}
MediaStreamFactory.createMediaStream(new StreamConstraints(audioConstraints, videoConstraints)).then(stream => { MediaStreamFactory.createMediaStream(new StreamConstraints(audioConstraints, videoConstraints)).then(stream => {
this._localStream = stream; this._localStream = stream;
this.dispatch(Events$1.WEBRTC_ON_LOCAL_STREAM, stream); this.dispatch(Events$1.WEBRTC_ON_LOCAL_STREAM, stream);
@ -7389,33 +7420,40 @@ var ZLMRTCClient = (function (exports) {
sendEncodings: [] sendEncodings: []
}; };
if (this.options.simulecast && stream.getVideoTracks().length > 0) { if (this.options.simulcast && stream.getVideoTracks().length > 0) {
VideoTransceiverInit.sendEncodings = [{ VideoTransceiverInit.sendEncodings = [{
rid: 'q', rid: 'h',
active: true, active: true,
scaleResolutionDownBy: 4.0 maxBitrate: 1000000
}, { }, {
rid: 'h', rid: 'm',
active: true, active: true,
scaleResolutionDownBy: 2.0 maxBitrate: 500000,
scaleResolutionDownBy: 2
}, { }, {
rid: 'f', rid: 'l',
active: true active: true,
maxBitrate: 200000,
scaleResolutionDownBy: 4
}]; }];
} }
if (stream.getAudioTracks().length > 0) { if (this.options.audioEnable) {
this.pc.addTransceiver(stream.getAudioTracks()[0], AudioTransceiverInit); if (stream.getAudioTracks().length > 0) {
} else { this.pc.addTransceiver(stream.getAudioTracks()[0], AudioTransceiverInit);
AudioTransceiverInit.direction = 'recvonly'; } else {
this.pc.addTransceiver('audio', AudioTransceiverInit); AudioTransceiverInit.direction = 'recvonly';
this.pc.addTransceiver('audio', AudioTransceiverInit);
}
} }
if (stream.getVideoTracks().length > 0) { if (this.options.videoEnable) {
this.pc.addTransceiver(stream.getVideoTracks()[0], VideoTransceiverInit); if (stream.getVideoTracks().length > 0) {
} else { this.pc.addTransceiver(stream.getVideoTracks()[0], VideoTransceiverInit);
VideoTransceiverInit.direction = 'recvonly'; } else {
this.pc.addTransceiver('video', VideoTransceiverInit); VideoTransceiverInit.direction = 'recvonly';
this.pc.addTransceiver('video', VideoTransceiverInit);
}
} }
/* /*
stream.getTracks().forEach((track,idx)=>{ stream.getTracks().forEach((track,idx)=>{
@ -7450,7 +7488,7 @@ var ZLMRTCClient = (function (exports) {
anwser.type = 'answer'; anwser.type = 'answer';
log(this.TAG, 'answer:', ret.sdp); log(this.TAG, 'answer:', ret.sdp);
this.pc.setRemoteDescription(anwser).then(() => { this.pc.setRemoteDescription(anwser).then(() => {
log(this.TAG, 'set remote success'); log(this.TAG, 'set remote sucess');
}).catch(e => { }).catch(e => {
error(this.TAG, e); error(this.TAG, e);
}); });
@ -7460,7 +7498,7 @@ var ZLMRTCClient = (function (exports) {
error(this.TAG, e); error(this.TAG, e);
}); });
}).catch(e => { }).catch(e => {
error(this.TAG, e); this.dispatch(Events$1.CAPTURE_STREAM_FAILED); //debug.error(this.TAG,e);
}); //const offerOptions = {}; }); //const offerOptions = {};
/* /*
@ -7495,7 +7533,48 @@ var ZLMRTCClient = (function (exports) {
this.dispatch(Events$1.WEBRTC_ICE_CANDIDATE_ERROR, event); this.dispatch(Events$1.WEBRTC_ICE_CANDIDATE_ERROR, event);
} }
_onconnectionstatechange(event) {
this.dispatch(Events$1.WEBRTC_ON_CONNECTION_STATE_CHANGE, this.pc.connectionState);
}
_onDataChannelOpen(event) {
log(this.TAG, 'ondatachannel open:', event);
this.dispatch(Events$1.WEBRTC_ON_DATA_CHANNEL_OPEN, event);
}
_onDataChannelMsg(event) {
log(this.TAG, 'ondatachannel msg:', event);
this.dispatch(Events$1.WEBRTC_ON_DATA_CHANNEL_MSG, event);
}
_onDataChannelErr(event) {
log(this.TAG, 'ondatachannel err:', event);
this.dispatch(Events$1.WEBRTC_ON_DATA_CHANNEL_ERR, event);
}
_onDataChannelClose(event) {
log(this.TAG, 'ondatachannel close:', event);
this.dispatch(Events$1.WEBRTC_ON_DATA_CHANNEL_CLOSE, event);
}
sendMsg(data) {
if (this.datachannel != null) {
this.datachannel.send(data);
} else {
error(this.TAG, 'data channel is null');
}
}
closeDataChannel() {
if (this.datachannel) {
this.datachannel.close();
this.datachannel = null;
}
}
close() { close() {
this.closeDataChannel();
if (this.pc) { if (this.pc) {
this.pc.close(); this.pc.close();
this.pc = null; this.pc = null;
@ -7528,15 +7607,108 @@ var ZLMRTCClient = (function (exports) {
} }
const quickScan = [{
'label': '4K(UHD)',
'width': 3840,
'height': 2160
}, {
'label': '1080p(FHD)',
'width': 1920,
'height': 1080
}, {
'label': 'UXGA',
'width': 1600,
'height': 1200,
'ratio': '4:3'
}, {
'label': '720p(HD)',
'width': 1280,
'height': 720
}, {
'label': 'SVGA',
'width': 800,
'height': 600
}, {
'label': 'VGA',
'width': 640,
'height': 480
}, {
'label': '360p(nHD)',
'width': 640,
'height': 360
}, {
'label': 'CIF',
'width': 352,
'height': 288
}, {
'label': 'QVGA',
'width': 320,
'height': 240
}, {
'label': 'QCIF',
'width': 176,
'height': 144
}, {
'label': 'QQVGA',
'width': 160,
'height': 120
}];
function GetSupportCameraResolutions$1() {
return new Promise(function (resolve, reject) {
let resolutions = [];
let ok = 0;
let err = 0;
for (let i = 0; i < quickScan.length; ++i) {
let videoConstraints = new VideoTrackConstraints(VideoSourceInfo.CAMERA);
videoConstraints.resolution = new Resolution(quickScan[i].width, quickScan[i].height);
MediaStreamFactory.createMediaStream(new StreamConstraints(false, videoConstraints)).then(stream => {
resolutions.push(quickScan[i]);
ok++;
if (ok + err == quickScan.length) {
resolve(resolutions);
}
}).catch(e => {
err++;
if (ok + err == quickScan.length) {
resolve(resolutions);
}
});
}
});
}
function GetAllScanResolution$1() {
return quickScan;
}
function isSupportResolution$1(w, h) {
return new Promise(function (resolve, reject) {
let videoConstraints = new VideoTrackConstraints(VideoSourceInfo.CAMERA);
videoConstraints.resolution = new Resolution(w, h);
MediaStreamFactory.createMediaStream(new StreamConstraints(false, videoConstraints)).then(stream => {
resolve();
}).catch(e => {
reject(e);
});
});
}
console.log('build date:', BUILD_DATE); console.log('build date:', BUILD_DATE);
console.log('version:', VERSION); console.log('version:', VERSION);
const Events = Events$1; const Events = Events$1;
const Media = media; const Media = media;
const Endpoint = RTCEndpoint; const Endpoint = RTCEndpoint;
const GetSupportCameraResolutions = GetSupportCameraResolutions$1;
const GetAllScanResolution = GetAllScanResolution$1;
const isSupportResolution = isSupportResolution$1;
exports.Endpoint = Endpoint; exports.Endpoint = Endpoint;
exports.Events = Events; exports.Events = Events;
exports.GetAllScanResolution = GetAllScanResolution;
exports.GetSupportCameraResolutions = GetSupportCameraResolutions;
exports.Media = Media; exports.Media = Media;
exports.isSupportResolution = isSupportResolution;
Object.defineProperty(exports, '__esModule', { value: true }); Object.defineProperty(exports, '__esModule', { value: true });

1
web_src/static/js/ZLMRTCClient.js.map

File diff suppressed because one or more lines are too long

2
web_src/static/js/jessibuca/decoder.js

File diff suppressed because one or more lines are too long

BIN
web_src/static/js/jessibuca/decoder.wasm

Binary file not shown.

637
web_src/static/js/jessibuca/jessibuca.d.ts

@ -0,0 +1,637 @@
declare namespace Jessibuca {
/** 超时信息 */
enum TIMEOUT {
/** 当play()的时候,如果没有数据返回 */
loadingTimeout = 'loadingTimeout',
/** 当播放过程中,如果超过timeout之后没有数据渲染 */
delayTimeout = 'delayTimeout',
}
/** 错误信息 */
enum ERROR {
/** 播放错误,url 为空的时候,调用 play 方法 */
playError = 'playError',
/** http 请求失败 */
fetchError = 'fetchError',
/** websocket 请求失败 */
websocketError = 'websocketError',
/** webcodecs 解码 h265 失败 */
webcodecsH265NotSupport = 'webcodecsH265NotSupport',
/** mediaSource 解码 h265 失败 */
mediaSourceH265NotSupport = 'mediaSourceH265NotSupport',
/** wasm 解码失败 */
wasmDecodeError = 'wasmDecodeError',
}
interface Config {
/**
*
* * string document.getElementById('id')
* */
container: HTMLElement | string;
/**
*
*/
videoBuffer?: number;
/**
* worker地址
* * decoder.js文件 decoder.js decoder.wasm文件必须是放在同一个目录下面 */
decoder?: string;
/**
* 使
*/
forceNoOffscreen?: boolean;
/**
* 'visibilityState''hidden'
*/
hiddenAutoPause?: boolean;
/**
* `false`
*/
hasAudio?: boolean;
/**
* 0()180270
*/
rotate?: boolean;
/**
* 1. `true`,canvas区域,, `setScaleMode(1)`
* 2. `false`canvas区域, `setScaleMode(0)`
*/
isResize?: boolean;
/**
* 1. `true`,canvas区域,,, `setScaleMode(2)`
*/
isFullSize?: boolean;
/**
* 1. `true`ws协议不检验是否以.flv为依据
*/
isFlv?: boolean;
/**
*
*/
debug?: boolean;
/**
* 1. ,
* 2. (loading)(heart),,timeout事件
*/
timeout?: number;
/**
* 1. ,
* 2. ,,timeout事件
*/
heartTimeout?: number;
/**
* 1. ,
* 2. ,,timeout事件
*/
loadingTimeout?: number;
/**
*
*/
supportDblclickFullscreen?: boolean;
/**
*
*/
showBandwidth?: boolean;
/**
*
*/
operateBtns?: {
/** 是否显示全屏按钮 */
fullscreen?: boolean;
/** 是否显示截图按钮 */
screenshot?: boolean;
/** 是否显示播放暂停按钮 */
play?: boolean;
/** 是否显示声音按钮 */
audio?: boolean;
/** 是否显示录制按 */
record?: boolean;
};
/**
* , canvas标签渲染视频并不会像video标签那样保持屏幕常亮
*/
keepScreenOn?: boolean;
/**
*
*/
isNotMute?: boolean;
/**
*
*/
loadingText?: boolean;
/**
*
*/
background?: string;
/**
* MediaSource硬解码
* * H.264Safari on iOS不支持
* * forceNoOffscreen false ()
*/
useMSE?: boolean;
/**
* Webcodecs硬解码
* * H.264 (chrome 94https或者localhost环境)
* * forceNoOffscreen false )
* */
useWCS?: boolean;
/**
*
* esc -> 退arrowUp -> arrowDown ->
*/
hotKey?: boolean;
/**
* 使MSE或者Webcodecs H265的时候wasm模式
* false Error true wasm模式播放
*/
autoWasm?: boolean;
/**
* heartTimeout ,
*/
heartTimeoutReplay?: boolean,
/**
* heartTimeoutReplay
*/
heartTimeoutReplayTimes?: number,
/**
* loadingTimeout loading之后自动再播放,
*/
loadingTimeoutReplay?: boolean,
/**
* heartTimeoutReplay
*/
loadingTimeoutReplayTimes?: number
/**
* wasm解码报错之后
*/
wasmDecodeErrorReplay?: boolean,
/**
* https://github.com/langhuihui/jessibuca/issues/152 解决方案
* WebGL图像预处理默认每次取4字节的数据540x960分辨率下的UV分量宽度是540/2=2704绿
*/
openWebglAlignment?: boolean
}
}
declare class Jessibuca {
constructor(config?: Jessibuca.Config);
/**
*
@example
// 开启
jessibuca.setDebug(true)
// 关闭
jessibuca.setDebug(false)
*/
setDebug(flag: boolean): void;
/**
*
@example
jessibuca.mute()
*/
mute(): void;
/**
*
@example
jessibuca.cancelMute()
*/
cancelMute(): void;
/**
*
*
* iPhonechrome等要求自动播放时使
*
* https://developers.google.com/web/updates/2017/09/autoplay-policy-changes
*/
audioResume(): void;
/**
*
* ,
* ,,timeout事件
@example
jessibuca.setTimeout(10)
jessibuca.on('timeout',function(){
//
});
*/
setTimeout(): void;
/**
* @param mode
* 0 canvas区域, `isResize` false
*
* 1 ,canvas区域,, `isResize` true
*
* 2 ,canvas区域,,, `isFullResize` true
@example
jessibuca.setScaleMode(0)
jessibuca.setScaleMode(1)
jessibuca.setScaleMode(2)
*/
setScaleMode(mode: number): void;
/**
*
*
* pause `play()`
@example
jessibuca.pause().then(()=>{
console.log('pause success')
jessibuca.play().then(()=>{
}).catch((e)=>{
})
}).catch((e)=>{
console.log('pause error',e);
})
*/
pause(): Promise<void>;
/**
* ,
@example
jessibuca.close();
*/
close(): void;
/**
*
@example
jessibuca.destroy()
*/
destroy(): void;
/**
*
@example
jessibuca.clearView()
*/
clearView(): void;
/**
*
@example
jessibuca.play('url').then(()=>{
console.log('play success')
}).catch((e)=>{
console.log('play error',e)
})
//
jessibuca.play()
*/
play(url?: string): Promise<void>;
/**
*
*/
resize(): void;
/**
*
*
* `videoBuffer`
*
@example
// 设置 200ms 缓冲
jessibuca.setBufferTime(0.2)
*/
setBufferTime(time: number): void;
/**
* 0() 180270
*
* > iOS没有全屏API *
@example
jessibuca.setRotate(0)
jessibuca.setRotate(90)
jessibuca.setRotate(270)
*/
setRotate(deg: number): void;
/**
*
* 0 1
*
* > mute cancelMute setVolume(0) mute方法mute setVolume(0)0
* @param volume 0;1
@example
jessibuca.setVolume(0.2)
jessibuca.setVolume(0)
jessibuca.setVolume(1)
*/
setVolume(volume: number): void;
/**
*
@example
var result = jessibuca.hasLoaded()
console.log(result) // true
*/
hasLoaded(): boolean;
/**
* , canvas标签渲染视频并不会像video标签那样保持屏幕常亮
* H5目前在chrome\edge 84, android chrome 84API, https页面
*
@example
jessibuca.setKeepScreenOn()
*/
setKeepScreenOn(): boolean;
/**
* ()
@example
jessibuca.setFullscreen(true)
//
jessibuca.setFullscreen(false)
*/
setFullscreen(flag: boolean): void;
/**
*
*
* @param filename , , `时间戳`
* @param format , png或jpeg或者webp , `png`
* @param quality , jpeg或者webp时0 ~ 1 , `0.92`
* @param type , download或者base64或者blob`download`
@example
jessibuca.screenshot("test","png",0.5)
const base64 = jessibuca.screenshot("test","png",0.5,'base64')
const fileBlob = jessibuca.screenshot("test",'blob')
*/
screenshot(filename?: string, format?: string, quality?: number, type?: string): void;
/**
*
* @param fileName
* @param fileType webmwebm mp4
@example
jessibuca.startRecord('xxx','webm')
*/
startRecord(fileName: string, fileType: string): void;
/**
*
@example
jessibuca.stopRecordAndSave()
*/
stopRecordAndSave(): void;
/**
*
@example
var result = jessibuca.isPlaying()
console.log(result) // true
*/
isPlaying(): boolean;
/**
*
@example
var result = jessibuca.isMute()
console.log(result) // true
*/
isMute(): boolean;
/**
*
@example
var result = jessibuca.isRecording()
console.log(result) // true
*/
isRecording(): boolean;
/**
* jessibuca
* @example
* jessibuca.on("load",function(){console.log('load')})
*/
on(event: 'load', callback: () => void): void;
/**
* ms
* @example
* jessibuca.on('timeUpdate',function (ts) {console.log('timeUpdate',ts);})
*/
on(event: 'timeUpdate', callback: () => void): void;
/**
* 2
* @example
* jessibuca.on("videoInfo",function(data){console.log('width:',data.width,'height:',data.width)})
*/
on(event: 'videoInfo', callback: (data: {
/** 视频宽 */
width: number;
/** 视频高 */
height: number;
}) => void): void;
/**
* 2
* @example
* jessibuca.on("audioInfo",function(data){console.log('numOfChannels:',data.numOfChannels,'sampleRate',data.sampleRate)})
*/
on(event: 'audioInfo', callback: (data: {
/** 声频通道 */
numOfChannels: number;
/** 采样率 */
sampleRate: number;
}) => void): void;
/**
*
* @example
* jessibuca.on("log",function(data){console.log('data:',data)})
*/
on(event: 'log', callback: () => void): void;
/**
*
* @example
* jessibuca.on("error",function(error){
if(error === Jessibuca.ERROR.fetchError){
//
}
else if(error === Jessibuca.ERROR.webcodecsH265NotSupport){
//
}
console.log('error:',error)
})
*/
on(event: 'error', callback: (err: Jessibuca.ERROR) => void): void;
/**
* KB 1,
* @example
* jessibuca.on("kBps",function(data){console.log('kBps:',data)})
*/
on(event: 'kBps', callback: (value: number) => void): void;
/**
*
* @example
* jessibuca.on("start",function(){console.log('start render')})
*/
on(event: 'start', callback: () => void): void;
/**
* ,
* @example
* jessibuca.on("timeout",function(error){console.log('timeout:',error)})
*/
on(event: 'timeout', callback: (error: Jessibuca.TIMEOUT) => void): void;
/**
* play()
* @example
* jessibuca.on("loadingTimeout",function(){console.log('timeout')})
*/
on(event: 'loadingTimeout', callback: () => void): void;
/**
* timeout之后没有数据渲染
* @example
* jessibuca.on("delayTimeout",function(){console.log('timeout')})
*/
on(event: 'delayTimeout', callback: () => void): void;
/**
*
* @example
* jessibuca.on("fullscreen",function(flag){console.log('is fullscreen',flag)})
*/
on(event: 'fullscreen', callback: () => void): void;
/**
*
* @example
* jessibuca.on("play",function(flag){console.log('play')})
*/
on(event: 'play', callback: () => void): void;
/**
*
* @example
* jessibuca.on("pause",function(flag){console.log('pause')})
*/
on(event: 'pause', callback: () => void): void;
/**
* boolean值
* @example
* jessibuca.on("mute",function(flag){console.log('is mute',flag)})
*/
on(event: 'mute', callback: () => void): void;
/**
* 1
* @example
* jessibuca.on("stats",function(s){console.log("stats is",s)})
*/
on(event: 'stats', callback: (stats: {
/** 当前缓冲区时长,单位毫秒 */
buf: number;
/** 当前视频帧率 */
fps: number;
/** 当前音频码率,单位bit */
abps: number;
/** 当前视频码率,单位bit */
vbps: number;
/** 当前视频帧pts,单位毫秒 */
ts: number;
}) => void): void;
/**
* 1
* @param performance 0: 表示卡顿,1: 表示流畅,2: 表示非常流程
* @example
* jessibuca.on("performance",function(performance){console.log("performance is",performance)})
*/
on(event: 'performance', callback: (performance: 0 | 1 | 2) => void): void;
/**
*
* @example
* jessibuca.on("recordStart",function(){console.log("record start")})
*/
on(event: 'recordStart', callback: () => void): void;
/**
*
* @example
* jessibuca.on("recordEnd",function(){console.log("record end")})
*/
on(event: 'recordEnd', callback: () => void): void;
/**
* 1s一次
* @example
* jessibuca.on("recordingTimestamp",function(timestamp){console.log("recordingTimestamp is",timestamp)})
*/
on(event: 'recordingTimestamp', callback: (timestamp: number) => void): void;
/**
* play方法 -> -> -> ->
* @param event
* @param callback
*/
on(event: 'playToRenderTimes', callback: (times: {
playInitStart: number, // 1 初始化
playStart: number, // 2 初始化
streamStart: number, // 3 网络请求
streamResponse: number, // 4 网络请求
demuxStart: number, // 5 解封装
decodeStart: number, // 6 解码
videoStart: number, // 7 渲染
playTimestamp: number,// playStart- playInitStart
streamTimestamp: number,// streamStart - playStart
streamResponseTimestamp: number,// streamResponse - streamStart
demuxTimestamp: number, // demuxStart - streamResponse
decodeTimestamp: number, // decodeStart - demuxStart
videoTimestamp: number,// videoStart - decodeStart
allTimestamp: number // videoStart - playInitStart
}) => void): void
/**
*
*
@example
jessibuca.on("load",function(){console.log('load')})
*/
on(event: string, callback: Function): void;
}
export default Jessibuca;

2
web_src/static/js/jessibuca/jessibuca.js

File diff suppressed because one or more lines are too long
Loading…
Cancel
Save