mirror of
https://github.com/ZLMediaKit/ZLMediaKit.git
synced 2026-07-07 12:18:12 +08:00
update zlmrtcclient.js sdk and demon (#3653)
1.can select video and audio source when push stream 2.support video and audio switch on fly for push
This commit is contained in:
@@ -81,9 +81,29 @@
|
||||
</p>
|
||||
<button onclick="send()">发送(send by datachannel)</button>
|
||||
<button onclick="close()">关闭(close datachannel)</button>
|
||||
|
||||
<p>
|
||||
<label for="videoDevice">videodevice:</label>
|
||||
<select id="videoDevice">
|
||||
</select>
|
||||
</p>
|
||||
|
||||
|
||||
<p>
|
||||
<label for="audioDevice">audiodevice:</label>
|
||||
<select id="audioDevice">
|
||||
</select>
|
||||
</p>
|
||||
|
||||
<p>
|
||||
<label for="switchDevice">switchDevice:</label>
|
||||
<input type="checkbox" id='switchDevice' checked="checked">
|
||||
</p>
|
||||
<button onclick="switchVideo()">切换视频(switch video)</button>
|
||||
<button onclick="switchAudio()">切换音频(switch audio)</button>
|
||||
|
||||
|
||||
|
||||
<div>11111</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
@@ -132,6 +152,24 @@
|
||||
document.getElementById("resolution").add(opt,null);
|
||||
});
|
||||
|
||||
ZLMRTCClient.GetAllMediaDevice().then(devices=>{
|
||||
devices.forEach(device=>{
|
||||
opt = document.createElement('option');
|
||||
opt.text = device.label + ":"+device.deviceId
|
||||
opt.value = JSON.stringify(device)
|
||||
if(device.kind == 'videoinput'){
|
||||
document.getElementById("videoDevice").add(opt,null)
|
||||
}else if(device.kind == 'audioinput'){
|
||||
document.getElementById("audioDevice").add(opt,null)
|
||||
}else if(device.kind == 'audiooutput'){
|
||||
// useless
|
||||
//console.error('not support device')
|
||||
}
|
||||
})
|
||||
}).catch(e=>{
|
||||
console.error(e);
|
||||
})
|
||||
|
||||
function start_play(){
|
||||
let elr = document.getElementById("resolution");
|
||||
let res = elr.options[elr.selectedIndex].text.match(/\d+/g);
|
||||
@@ -157,6 +195,12 @@
|
||||
window.history.pushState(null, null, newUrl);
|
||||
}
|
||||
|
||||
let elv = document.getElementById("videoDevice");
|
||||
let ela = document.getElementById("audioDevice");
|
||||
|
||||
let vdevid = JSON.parse(elv.options[elv.selectedIndex].value).deviceId
|
||||
let adevid = JSON.parse(ela.options[ela.selectedIndex].value).deviceId
|
||||
|
||||
player = new ZLMRTCClient.Endpoint(
|
||||
{
|
||||
element: document.getElementById('video'),// video 标签
|
||||
@@ -169,6 +213,8 @@
|
||||
recvOnly:recvOnly,
|
||||
resolution:{w,h},
|
||||
usedatachannel:document.getElementById('datachannel').checked,
|
||||
videoId:vdevid, // 不填选择默认的
|
||||
audioId:adevid, // 不填选择默认的
|
||||
}
|
||||
);
|
||||
|
||||
@@ -344,6 +390,39 @@
|
||||
// get_media_list();
|
||||
}, 5000);
|
||||
|
||||
function switchVideo(){
|
||||
if(player){
|
||||
// first arg bool false mean switch to screen video , second ignore
|
||||
// true mean switch to video , second is camera deviceid
|
||||
let elv = document.getElementById("videoDevice");
|
||||
let vdevid = JSON.parse(elv.options[elv.selectedIndex].value).deviceId
|
||||
player.switchVideo(document.getElementById('switchDevice').checked,vdevid).then(()=>{
|
||||
// switch video successful
|
||||
|
||||
}).catch(e=>{
|
||||
// switch video failed
|
||||
console.error(e);
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function switchAudio(){
|
||||
if(player){
|
||||
// first arg bool false mean switch to screen audio , second ignore
|
||||
// true mean switch to mic , second is mic deviceid
|
||||
let ela = document.getElementById("audioDevice");
|
||||
let adevid = JSON.parse(ela.options[ela.selectedIndex].value).deviceId
|
||||
player.switcAudio(document.getElementById('switchDevice').checked,adevid).then(()=>{
|
||||
// switch audio successful
|
||||
|
||||
}).catch(e=>{
|
||||
// switch audio failed
|
||||
console.error(e);
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
</body>
|
||||
|
||||
Reference in New Issue
Block a user