Ensuite, l’utilisateur clique sur le input type=file
utilisateur du input type=file
doit obtenir le upload file + camera
boîte de dialog de la upload file + camera
. J’utilise pour cela les atsortingbuts HTML accept
et capture
. Mais sur certains appareils modernes, cela ne se produit pas. Ci-dessous, il y a les exemples de code et le tableau qui fonctionne ou non. Les exemples de code sont testés dans Mobile Safari
et Chrome
.
TL; DR:
J’ai 5 exemples de code avec juste input type file
:
1. ( jsfiddle
)
2. ( jsfiddle
)
3. ( jsfiddle
)
4. ( jsfiddle
)
5. ( jsfiddle
)
Dispositifs de test:
Tableau de résultats:
upload image dialog with camera
upload dialog(not image only) with camera
activée upload dialog(not image only) with camera
only camera
activée Chrome
Mobile Safari
#
-------------------------------------------------------------------------------- |devices/example | Ch 1| Ch 2| Ch 3| Ch 4| Ch 5| MS 1| MS 2| MS 3| MS 4| MS 5| -------------------------------------------------------------------------------- |Samsung S3/4.1 | N | N | P | P | W | W | N | P | P | W | -------------------------------------------------------------------------------- |Samsung S3/4.3 | N | N | P | P | P | N | N | P | P | P | -------------------------------------------------------------------------------- |Samsung Galaxy Tab| N | N | P | P | W | W | N | P | P | W | -------------------------------------------------------------------------------- |Samsung Note | N | N | P | P | W | W | N | P | P | W | -------------------------------------------------------------------------------- |iPhone 5 | W | W | P | P | W | W | Y | P | P | W | -------------------------------------------------------------------------------- |Nexus 4 | N | N | P | P | W | - | - | - | - | - | --------------------------------------------------------------------------------
Comme vous pouvez le voir, je ne peux obtenir que le upload file + camera
dialog de la upload file + camera
pour tous les navigateurs en utilisant
uniquement. Mais il n’y a pas d’atsortingbut de
capture
dans ce cas, et cela m’inquiète et il y a un problème avec Android 4.3.
Merci.
PS La question est spéciale, mais sur mon site, je dois fournir aux utilisateurs un access à ses images et à sa caméra. Je pense également que ma table peut être utile pour tout le monde et je vais aussi chercher une réponse et afficher ma réponse ici si personne ne répond.
Ceci est la réponse réelle. Il suffit de le poster ici pour les prochains utilisateurs:
En fait, il semble que les implémentations actuelles ne reposent pas du tout sur l’atsortingbut de capture, mais seulement sur le type et les atsortingbuts d’acceptation: le navigateur affiche une boîte de dialog dans laquelle l’utilisateur peut choisir l’emplacement du fichier et la
capture
l’atsortingbut n’est pas pris en compte. Par exemple, iOS Safari s’appuie sur l’atsortingbut d’acceptation (et non sur la capture) pour les images et les vidéos (pas l’audio). Même si vous n’utilisez pas l’atsortingbutaccept
, le navigateur vous permettra de choisir entre “Take Photo or Video” et “Choose Existing” (merci à @ firt de l’avoir signalé).
De ceci
EDITED 17 févr. 2016: Ce comportement est toujours actif sur les appareils.
Le code “correct” et celui que vous devriez utiliser est le 5ème:
C’est pourquoi cela fonctionne correctement sur la plupart de vos appareils. Le code ci-dessus est correct , complet et suffisant pour indiquer à la fois iOS et Android:
accept="video/*"
pour la vidéo et accept="audio/*"
pour l’audio, ignorez tout pour autoriser).
- Puis-je faire confiance aux navigateurs pour l’append à la boîte de dialog de téléchargement de la caméra sans atsortingbut de capture?
Oui.
L’atsortingbut de capture
n’est PAS utilisé pour inclure l’option de caméra dans la boîte de dialog ( suffit pour cela) mais pour indiquer que la capture directe à partir de la webcam est préférable . D’après les spécifications du W3C :
L’atsortingbut capture est un atsortingbut booléen qui, s’il est spécifié, indique que la capture de média directement depuis le périphérique … est préférable.
capture
est capture
charge par Android 3.0+, ce qui vous amènera directement à l’application appareil photo si la capture
est présente dans le code.
Il n’y a pas de support dans iOS6-10 qui vous donnera toujours au moins 2 options: “Take Photo” + “Photothèque”.
L’atsortingbut de capture
a évolué dans la spécification (c’est pourquoi vous verrez plusieurs versions dans StackOverflow):
accept="image/*;capture=camera"
capture="camera"
(chaîne) capture
(booléen, recommandation du candidat W3C ,) PS: J’ai fait une tonne de recherches sur HTML Media Capture, voir la syntaxe correcte pour HTML Media Capture et la nouvelle invite pour Media Capture dans iOS9 . Voici mon banc de test avec plus de 20 combinaisons de codes.