Comment accéder à la caméra d'un mobile depuis une application Web?
Dans mon application Web (non native) pour mobiles, je souhaite prendre une photo et la télécharger, mais je ne souhaite pas utiliser Adobe Flash. Est-ce qu'il y a un moyen de faire ça?
Dans iPhone iOS6 et à partir de Android ICS, HTML5 comporte le tag suivant qui vous permet de prendre des photos à partir de votre appareil:
<input type="file" accept="image/*" capture="camera">
Capture peut prendre des valeurs telles que caméra, caméscope et audio.
Je pense que cette balise ne fonctionnera certainement pas dans iOS5, pas sûr à ce sujet.
De nos jours au moins avec Android c'est relativement facile. Utilisez simplement une balise d’entrée de fichier normale. Lorsque l’utilisateur clique dessus, le téléphone lui demande s’il souhaite utiliser l’appareil photo (ou les gestionnaires de fichiers, etc.) pour télécharger un fichier. Il suffit de prendre une photo avec l'appareil photo et celle-ci sera automatiquement ajoutée et téléchargée.
Aucune idée sur l'iphone. Peut-être que quelqu'un peut éclairer à ce sujet. EDIT: Iphone fonctionne de manière similaire.
Exemple de la balise d'entrée:
<input type="file" accept="image/*" capture="camera">
Safari & Chrome sous iOS 6+ et Android 2.2+ prennent en charge HTML Media Capture, ce qui vous permet de prendre des photos avec l'appareil photo de votre appareil ou de sélectionner un appareil existant:
<input type="file" accept="image/*">
Voici comment cela fonctionne sur iOS 10:
Android 3.0+ et Safari sur iOS10.3 + prennent également en charge l'attribut capture qui permet de passer directement à l'appareil photo.
<input type="file" accept="image/*" capture>
capture="camera" (String) et accept="image/*;capture=camera" (Parameter) faisaient partie des anciennes spécifications et ont été remplacés par capture (Boolean) dans la recommandation du candidat au W3C.
Documentation de support: this livre O'Reilly 201 et mes tests
Juste pour mettre à jour ceci, la norme est maintenant:
<input type="file" name="image" accept="image/*" capture="environment">
pour accéder à la caméra (arrière) faisant face à l'environnement, et
<input type="file" name="image" accept="image/*" capture="user">
pour la caméra orientée vers l'utilisateur (avant). Pour accéder à la vidéo, remplacez "image" par "vidéo".
Testé sur iPhone 5c, sous iOS 10.3.3, le micrologiciel 760, fonctionne correctement.
eh bien, il existe une nouvelle fonctionnalité HTML5 pour accéder à la caméra de l'appareil natif - "API getUserMedia"
REMARQUE: HTML5 peut gérer la capture de photos à partir d’une page Web sur Android (du moins sur les versions les plus récentes, gérées par le système d’exploitation Honeycomb; mais il ne peut pas le gérer sur les iPhones mais sur iOS 6).
Le kit de développement logiciel HTML5 d'AppMobi avait jadis promis l'accès aux fonctionnalités de l'appareil natif - y compris l'appareil photo - à partir d'une application basée sur HTML5, mais ne relevait plus de Google. Au lieu de cela, essayez le réponses basées sur HTML5 dans cet article .
Vous pouvez utiliser WEBRTC mais, malheureusement, il n'est pas pris en charge par tous les navigateurs Web. CI-DESSOUS IS LE LIEN À MONTRER QUEL NAVIGATEUR le prend en charge http://caniuse.com/stream
Et ce lien vous donne une idée de la façon dont vous pouvez y accéder (exemple de code). http://www.html5rocks.com/en/tutorials/getusermedia/intro/
Il convient de noter que des fonctionnalités de sécurité ont été implémentées, qui nécessitent que l'application soit exécutée localement sous localhost ou via SSL pour que GetUserMedia () fonctionne.
J'ai découvert cela en essayant plusieurs des démos disponibles et j'étais déçu quand ils ne fonctionnaient pas! Voir: Nouvelles restrictions de sécurité
Vous voudrez utiliser getUserMedia pour accéder à la caméra.
Ce tutoriel décrit les bases pour accéder à une caméra de périphérique à partir du navigateur: https://medium.com/@aBenjamin765/make-a-camera-web-app-tutorial-part-1-ec284af8dddf
Remarque: Cela fonctionne sur la plupart des appareils Android et sous iOS dans Safari uniquement.
Je ne connais aucun moyen d'accéder à la caméra d'un téléphone portable à partir du navigateur Web sans un mécanisme supplémentaire (Flash ou un type de conteneur permettant d'accéder à l'API matérielle).
Pour ces derniers, consultez PhoneGap: http://docs.phonegap.com/phonegap_camera_camera.md.html
Avec cela, vous devriez pouvoir accéder à la caméra au moins sur les appareils iOS et Android.
Je ne pense pas que vous puissiez - il existe un projet de W3C pour obtenir de l'audio ou de la vidéo, mais il n'y a pas encore d'implémentation sur aucun des principaux systèmes d'exploitation mobiles.
Deuxième meilleur La seule option est de suivre la suggestion de Dennis d'utiliser PhoneGap. Cela signifie que vous devez créer une application native et l'ajouter à la boutique et au marché des applications mobiles.