J'essaie d'utiliser la fonctionnalité getUserMedia de WebRTC pour prendre des instantanés dans un flux vidéo provenant de la caméra de l'utilisateur. Le problème est que je veux utiliser une résolution de 640 X 480 fonctionnant respectivement dans les versions Firefox 19.02, Opera 12.14 et Chrome 25.0.1364.172, mais je ne suis pas en mesure d'utiliser cette résolution dans Firefox et Opera. Lorsque j'essaie, l'image apparaît coupée du bas avec une résolution de 640 X 360. De toute façon, si j'essaie de changer la résolution dans Chrome, cela ne fonctionne pas non plus avec une résolution supérieure à 640 X 480. Est-ce que quelqu'un a le même problème ? Je voudrais savoir si c'est un bug ou autre, mais je n'ai vu aucune information à ce sujet. C'est mon code, j'ai essayé de plusieurs façons comme mettre des contraintes avec la largeur et la hauteur minimum mais ça ne marche pas :
le script :
navigator.getUserMedia = navigator.getUserMedia || navigator.mozGetUserMedia || navigator.webkitGetUserMedia || navigator.msGetUserMedia;
if(navigator.getUserMedia){
navigator.getUserMedia({
video: true
}, onSuccess, onError);
}
else{
alert('An error has occurred starting the webcam stream, please revise the instructions to fix the problem');
}
function onSuccess(stream) {
var video = document.getElementById('webcam');
if(navigator.webkitGetUserMedia || navigator.mozGetUserMedia){
video.src = window.URL.createObjectURL(stream);
}
else if(navigator.msGetUserMedia){
//future implementation over internet explorer
}
else{
video.src = stream;
}
video.play();
}
function onError() {
alert('There has been a problem retrieving the streams - did you allow access?');
}le css (c'est seulement pour prouver, il ne met pas tout à la bonne place) :
body {
margin: 0px 0px;
padding: 0px 0px;
}
#videoFrame {
margin: 0px auto;
width: 640px;
height: 480px;
border: 10px #333 solid;
}
#webcam {
videoWidth: 640px;
videoHeight: 480px;
}
#captureFrame {
margin: 0px auto;
width: 640px;
height: 480px;
}
#webcamContent {
width: 1280px;
height: 480px;
}et le fichier jsp :
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<title>Testing WebRTC</title>`
<link href="css/styles.css" rel="stylesheet" type="text/css" />`
</head>
<body>
<div id="webcamContent">
<div id="videoFrame">
<video id="webcam"></video>
</div>
<div id="captureFrame">
<canvas id="bioCapture"></canvas>
</div>
</div>
<script src="js/webRTC.js"></script>
</body>
</html>Merci d'avance !
