aboutsummaryrefslogtreecommitdiff
path: root/files/es/web/api/navigator/getusermedia
diff options
context:
space:
mode:
Diffstat (limited to 'files/es/web/api/navigator/getusermedia')
-rw-r--r--files/es/web/api/navigator/getusermedia/index.html184
1 files changed, 184 insertions, 0 deletions
diff --git a/files/es/web/api/navigator/getusermedia/index.html b/files/es/web/api/navigator/getusermedia/index.html
new file mode 100644
index 0000000000..e3fd046743
--- /dev/null
+++ b/files/es/web/api/navigator/getusermedia/index.html
@@ -0,0 +1,184 @@
+---
+title: Navigator.getUserMedia
+slug: Web/API/Navigator/getUserMedia
+translation_of: Web/API/Navigator/getUserMedia
+---
+<p>Pide al usuario permiso para usar un dispositivo multimedia como una cámara o micrófono. Si el usuario concede este permiso, el successCallback es invocado en la aplicación llamada con un objeto <a href="/en-US/docs/WebRTC/MediaStream_API#LocalMediaStream" title="WebRTC/MediaStream_API#LocalMediaStream">LocalMediaStream</a> como argumento.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">navigator.getUserMedia ( constraints, successCallback, errorCallback );</pre>
+
+<p><strong>Ejemplo</strong></p>
+
+<p>Aquí  hay un ejemplo usando getUserMedia() con los prefijos del navegador.</p>
+
+<pre class="brush: js">navigator.getMedia = ( navigator.getUserMedia ||
+ navigator.webkitGetUserMedia ||
+ navigator.mozGetUserMedia);
+
+navigator.getMedia (
+
+ // Restricciones (contraints) *Requerido
+ {
+ video: true,
+ audio: true
+ },
+
+ // Funcion de finalizacion (Succes-Callback) *Requerido
+ function(localMediaStream) {
+ var video = document.querySelector('video');
+ video.src = window.URL.createObjectURL(localMediaStream);
+ video.onloadedmetadata = function(e) {
+ // Haz algo con el video aquí.
+ };
+ },
+
+ // errorCallback *Opcional
+ function(err) {
+ console.log("Ocurrió el siguiente error: " + err);
+ }
+
+);</pre>
+
+<h2 id="Parámetros">Parámetros</h2>
+
+<table>
+ <thead>
+ <tr>
+ <th scope="col">Parámetro</th>
+ <th scope="col">
+ <p>Requerido/Opcional</p>
+ </th>
+ <th scope="col">Descripción</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>constraints</td>
+ <td>Requerido</td>
+ <td>El tipo de multimedia que soporta el objeto LocalMediaStream devuelto en el successCallback.</td>
+ </tr>
+ <tr>
+ <td>successCallback </td>
+ <td>Requerido</td>
+ <td>La función a invocar cuando se pasa el objeto LocalMediaStream.</td>
+ </tr>
+ <tr>
+ <td>errorCallback</td>
+ <td>Opcional</td>
+ <td>La función que se invoca en la aplicación si falla la llamada.</td>
+ </tr>
+ </tbody>
+</table>
+
+<h3 id="constraints">constraints</h3>
+
+<p>El parámetro <code>constraints</code> es un objeto <code>MediaStreamConstraints</code> con dos miembros booleanos: <code>video</code> y <code>audio</code>. Estos describen el los tipos de multimedia soportados por el objeto <a href="/en-US/docs/WebRTC/MediaStream_API#LocalMediaStream" title="WebRTC/MediaStream_API#LocalMediaStream">LocalMediaStream</a>. Uno o ambos deben ser especificados para validar el argumento del parametro constraint. Si un constraint especificado no es soportado por el navegador, <code>getUserMedia </code>llama a la función <code>errorCallback </code>con el error <code>NOT_SUPPORTED_ERROR</code>. Si el navegador no puede encontrar ninguna fuente multimedia con el tipo especificado, <code>getUserMedia </code>llama a la función <code>errorCallback </code>con el error <code>MANDATORY_UNSATISFIED_ERR</code>.</p>
+
+<p>Si el valor o el miembro no es especificado en el objeto, el valor del miembro por defecto será falso. El siguiente ejemplo muestra como definir el constraints para audio y video:</p>
+
+<pre>{ video: true, audio: true }</pre>
+
+<h3 id="successCallback">successCallback</h3>
+
+<p>La función getUserMedia llamará a la función especificada en el <code>successCallback </code>con el objeto <a href="/en-US/docs/WebRTC/MediaStream_API#LocalMediaStream" title="WebRTC/MediaStream_API#LocalMediaStream">LocalMediaStream</a> que contenga la secuencia multimedia. Puedes asignar el objeto al elemento apropiado y trabajar con él, como se muestra en el siguiente ejemplo:</p>
+
+<pre>function(localMediaStream) {
+ var video = document.querySelector('video');
+ video.src = window.URL.createObjectURL(localMediaStream);
+ video.onloadedmetadata = function(e) {
+ // Haz algo aquí con el video.
+ };
+},</pre>
+
+<h3 id="errorCallback">errorCallback</h3>
+
+<p>La función <code>getUserMedia </code>llama a la función indicada en el errorCallback con un <code>código</code> como argumento. Los códigos de error se describen a continuación:</p>
+
+<table>
+ <thead>
+ <tr>
+ <th scope="col">Error </th>
+ <th scope="col">Descripción </th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>PERMISSION_DENIED </td>
+ <td>El usuario denegó el permiso para usar el dispositivo multimadia requerido para esta operación. </td>
+ </tr>
+ <tr>
+ <td>NOT_SUPPORTED_ERROR </td>
+ <td>Un constraint especificado no es soportado por el navegador.</td>
+ </tr>
+ <tr>
+ <td>MANDATORY_UNSATISFIED_ERROR </td>
+ <td>No se encontraron fuentes multimedia del tipo especificado en el constraints.</td>
+ </tr>
+ <tr>
+ <td>NO_DEVICES_FOUND</td>
+ <td>No se encontró ninguna webcam instalada.</td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_los_navegadores">Compatibilidad con los navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+ <tr>
+ <th>Característica</th>
+ <th>Chrome</th>
+ <th>Firefox (Gecko)</th>
+ <th>Internet Explorer</th>
+ <th>Opera</th>
+ <th>Safari (WebKit)</th>
+ </tr>
+ <tr>
+ <td>Stream API </td>
+ <td>21{{property_prefix("webkit")}} </td>
+ <td>20{{property_prefix("moz")}} </td>
+ <td>{{CompatNo}} </td>
+ <td>12</td>
+ <td>{{CompatUnknown}} </td>
+ </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+ <tr>
+ <th>Característica</th>
+ <th>Android</th>
+ <th>Firefox Mobile (Gecko)</th>
+ <th>IE Phone</th>
+ <th>Opera Mobile</th>
+ <th>Safari Mobile</th>
+ </tr>
+ <tr>
+ <td>Stream API </td>
+ <td>{{CompatNo}} </td>
+ <td>{{CompatNo}}</td>
+ <td>{{CompatUnknown}} </td>
+ <td>12</td>
+ <td>{{CompatNo}} </td>
+ </tr>
+ </tbody>
+</table>
+</div>
+
+<p><span style="line-height: 1.5em;">Actualmente el uso de WebRTC para acceder a la cámara esta soportado en Chrome, Opera y Firefox 20.</span></p>
+
+<h2 id="Vease_también">Vease también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/WebRTC" title="WebRTC">WebRTC</a> - la página introductoria a la API</li>
+ <li><a href="/en-US/docs/WebRTC/MediaStream_API" title="WebRTC/MediaStream_API">MediaStream API</a> - la API para los objetos multimedia</li>
+ <li><a href="/en-US/docs/WebRTC/taking_webcam_photos" title="WebRTC/taking_webcam_photos">Taking webcam photos</a> - un tutorial acerca del uso de getUserMedia()</li>
+</ul>