WebRTC Chrome 摄像头限制
WebRTC Chrome Camera constraints
我试图在我的 peer.js webrtc 应用程序中设置 getusermedia 视频约束,例如设置 min/max 帧速率和分辨率等...,这是一个简单的点对点聊天应用程序。我一直在尝试将它集成到我的应用程序中,但它似乎中断了 it.Any 帮助将不胜感激其他在线教程看起来与我的应用程序设置不同。在功能 1 下方,我一直试图设置限制,但它不再显示视频了。这是正确的地方吗?
这些限制是否也适用于视频文件播放而不是网络摄像头?我正在使用 Google chrome 标志来播放视频文件而不是相机。
navigator.getWebcam = (navigator.getUserMedia ||
navigator.webkitGetUserMedia ||
navigator.mozGetUserMedia ||
navigator.msGetUserMedia);
// PeerJS object ** FOR PRODUCTION, GET YOUR OWN KEY at http://peerjs.com/peerserver **
var peer = new Peer({
key: 'XXXXXXXXXXXXXXXX',
debug: 3,
config: {
'iceServers': [{
url: 'stun:stun.l.google.com:19302'
}, {
url: 'stun:stun1.l.google.com:19302'
}, {
url: 'turn:numb.viagenie.ca',
username: "XXXXXXXXXXXXXXXXXXXXXXXXX",
credential: "XXXXXXXXXXXXXXXXX"
}]
}
});
// On open, set the peer id so when peer is on we display our peer id as text
peer.on('open', function(){
$('#my-id').text(peer.id);
});
peer.on('call', function(call) {
// Answer automatically for demo
call.answer(window.localStream);
step3(call);
});
// Click handlers setup
$(function() {
$('#make-call').click(function() {
//Initiate a call!
var call = peer.call($('#callto-id').val(), window.localStream);
step3(call);
});
$('end-call').click(function() {
window.existingCall.close();
step2();
});
// Retry if getUserMedia fails
$('#step1-retry').click(function() {
$('#step1-error').hide();
step();
});
// Get things started
step1();
});
function step1() {
//Get audio/video stream
navigator.getWebcam({audio: true, video: true}, function(stream){
// Display the video stream in the video object
$('#my-video').prop('src', URL.createObjectURL(stream));
// Displays error
window.localStream = stream;
step2();
}, function(){ $('#step1-error').show(); });
}
function step2() { //Adjust the UI
$('#step1', '#step3').hide();
$('#step2').show();
}
function step3(call) {
// Hang up on an existing call if present
if (window.existingCall) {
window.existingCall.close();
}
// Wait for stream on the call, then setup peer video
call.on('stream', function(stream) {
$('#their-video').prop('src', URL.createObjectURL(stream));
});
$('#step1', '#step2').hide();
$('#step3').show();
}
您的 JavaScript 看起来无效。您不能在函数参数列表中声明 var。你贴错了吗?尝试:
var constraints = {
audio: false,
video: { mandatory: { minWidth: 1280, minHeight: 720 } }
};
navigator.getWebcam(constraints, function(stream){ etc. }
现在至少 JavaScript 有效。我不熟悉 PeerJS,但是你使用的约束看起来像 Chrome 的,所以如果你在 Chrome 上,那么希望它们能工作,除非 PeerJS 对某些人做不同的事情原因。
你的主题说 "WebRTC Camera constraints" 所以我应该提到 Chrome 约束是非标准的。有关解释,请参阅 。
我试图在我的 peer.js webrtc 应用程序中设置 getusermedia 视频约束,例如设置 min/max 帧速率和分辨率等...,这是一个简单的点对点聊天应用程序。我一直在尝试将它集成到我的应用程序中,但它似乎中断了 it.Any 帮助将不胜感激其他在线教程看起来与我的应用程序设置不同。在功能 1 下方,我一直试图设置限制,但它不再显示视频了。这是正确的地方吗?
这些限制是否也适用于视频文件播放而不是网络摄像头?我正在使用 Google chrome 标志来播放视频文件而不是相机。
navigator.getWebcam = (navigator.getUserMedia ||
navigator.webkitGetUserMedia ||
navigator.mozGetUserMedia ||
navigator.msGetUserMedia);
// PeerJS object ** FOR PRODUCTION, GET YOUR OWN KEY at http://peerjs.com/peerserver **
var peer = new Peer({
key: 'XXXXXXXXXXXXXXXX',
debug: 3,
config: {
'iceServers': [{
url: 'stun:stun.l.google.com:19302'
}, {
url: 'stun:stun1.l.google.com:19302'
}, {
url: 'turn:numb.viagenie.ca',
username: "XXXXXXXXXXXXXXXXXXXXXXXXX",
credential: "XXXXXXXXXXXXXXXXX"
}]
}
});
// On open, set the peer id so when peer is on we display our peer id as text
peer.on('open', function(){
$('#my-id').text(peer.id);
});
peer.on('call', function(call) {
// Answer automatically for demo
call.answer(window.localStream);
step3(call);
});
// Click handlers setup
$(function() {
$('#make-call').click(function() {
//Initiate a call!
var call = peer.call($('#callto-id').val(), window.localStream);
step3(call);
});
$('end-call').click(function() {
window.existingCall.close();
step2();
});
// Retry if getUserMedia fails
$('#step1-retry').click(function() {
$('#step1-error').hide();
step();
});
// Get things started
step1();
});
function step1() {
//Get audio/video stream
navigator.getWebcam({audio: true, video: true}, function(stream){
// Display the video stream in the video object
$('#my-video').prop('src', URL.createObjectURL(stream));
// Displays error
window.localStream = stream;
step2();
}, function(){ $('#step1-error').show(); });
}
function step2() { //Adjust the UI
$('#step1', '#step3').hide();
$('#step2').show();
}
function step3(call) {
// Hang up on an existing call if present
if (window.existingCall) {
window.existingCall.close();
}
// Wait for stream on the call, then setup peer video
call.on('stream', function(stream) {
$('#their-video').prop('src', URL.createObjectURL(stream));
});
$('#step1', '#step2').hide();
$('#step3').show();
}
您的 JavaScript 看起来无效。您不能在函数参数列表中声明 var。你贴错了吗?尝试:
var constraints = {
audio: false,
video: { mandatory: { minWidth: 1280, minHeight: 720 } }
};
navigator.getWebcam(constraints, function(stream){ etc. }
现在至少 JavaScript 有效。我不熟悉 PeerJS,但是你使用的约束看起来像 Chrome 的,所以如果你在 Chrome 上,那么希望它们能工作,除非 PeerJS 对某些人做不同的事情原因。
你的主题说 "WebRTC Camera constraints" 所以我应该提到 Chrome 约束是非标准的。有关解释,请参阅