Una de las preguntas que nos hacen con más frecuencia a través del formulario de contacto es cómo tener acceso a la cámara de fotos y de vídeo de nuestro iPhone con el fin de utilizar en el navegador en nuestras aplicaciones web. Es una pregunta muy válida, una que yo no he puesto en práctica en ninguna aplicación pero que veo que, para otro tipo de aplicaciones aparte de las ya conocidas, es muy práctica. Por supuesto, la cámara es una de las principales inputs de los dispositivos móviles, pero el elemento input es la clave para acceder a la cámara de fotos y vídeo con HTML5. En este tutorial te mostramos cómo manejar la cámara de fotos y vídeo del iPhone con HTML5 de una manera sencilla y rápida. Cómo desarrollador, te decimos de antemano, que lo agradecerás gracias a su simple implementación.
HTML5 Cámara de fotos
En el caso de que el usuario tenga una cámara para fotos y vídeo, el elemento input con el tipo del fichero es necesario:
<input type="file" accept="image/*">
Para restringir solo a imágenes debes especificar en el atributo accept del input, el tipo de fichero que deseas que se carguen en la web.
HTML5 Vídeo
Si estás buscando ser más dinámico y aceptar vídeos en tu web, el atributo accept debe cambiar:
<input type="file" accept="video/*;capture=camcorder">
En este caso, el diálogo de subida en dispositivos iOS te permitirá cargar, ya sea fotos o vídeos.
Esto que te hemos mostrado hoy aún parece un método demasiado básico para subir audio o vídeo, pero es probable que sea lo suficientemente bueno para la mayoría de los desarrolladores y sistemas por lo sencillo de su implementación. En el futuro seguro que tendremos un mejor método para la subida de audio y vídeo dinámico sin un diálogo de subida feo.
Y hasta aquí el tutorial sobre como manejar la cámara de fotos y vídeo del iPhone con HTML5, espero que os haya sido de utilidad y sepáis aplicarlo en vuestros futuros proyectos. A priori, me parece muy útil este ejemplo para aplicaciones en las que los usuarios envían imágenes o vídeos para un formateo específico como pueda ser, algún tratamiento de imagen o edición de vídeo online. Ya sabéis que nos podéis proponer temas en la zona de comentarios que se ubica un poco más abajo, o bien utilizar la intranet de usuario para escribir tus propios tutoriales.