web-dev-qa-db-fra.com

Enregistrer la voix de l'iPhone en utilisant HTML5

Je travaille sur une application Web mobile uniquement pour mon plaisir et pour mes recherches. Tout semblait fonctionner assez bien avec HTML5/CSS et JavaScript pour l'application client, bien qu'il semble que j'ai besoin d'une technologie tierce pour l'enregistrement vocal. J'avais une très bonne solution fonctionnant avec Flash, mais après l'avoir testée avec mon iPhone, je m'étais souvenu qu'ils ne semblaient pas prendre en charge Flash, ce qui est décevant car j'avais une très bonne solution. Je veux enregistrer des voix avec HTML5 dans Iphone et Android. Y a-t-il un moyen?

javascripthtml5google-chrome
17
Bilal Ahmed

Vous pouvez essayer HTML Media Capture. Un article sur dev.opera dit:

Android OS 3.0 a été la première plateforme à fournir HTML Media Capture support, via son navigateur Android Webkit par défaut. Maintenant HTML Media Capture est également supporté par:

  • Safari et Chrome Mobile pour iOS 6+
  • Chrome Mobile pour Android OS 3+
  • Firefox Mobile pour Android OS 3+
  • Opera 16 pour Android OS 3+

Néanmoins, certains d'entre eux n'implémentent que partiellement la spécification ou implémenter une spécification W3C plus ancienne, qui rend le code ci-dessus légèrement différent:

<input type="file" accept="image/*" capture="camera">
<input type="file" accept="video/*" capture="camcorder">
<input type="file" accept="audio/*" capture="microphone">

Il est relié à la une page de démonstration que vous pouvez essayer sur votre mobile. J'ai aussi trouvé cette page d'exemple . Dans mes tests rapides sur iOS 7, cela ne fonctionnait correctement que pour les photos et les vidéos.

Edit: Lectures supplémentaires suggère que accept="audio/*" ne soit pas réellement pris en charge sur iOS 6 et 7, uniquement accept="image/*" et accept="video/*".

Update: un test rapide sur iOS 8.3 suggère que rien n'a changé ici: accept="image/*" et accept="video/*" sont pris en charge, mais accept="audio/*" ne l'est pas.

Update: un test rapide sur iOS 10.0.2 suggère que accept="audio/*" n'est toujours pas pris en charge, bien qu'il semble possible de télécharger un fichier audio à partir d'iCloud Drive ou de Dropbox maintenant.

Mise à jour: malgré ce qui est écrit dans l'article du blog Webkit , il semble que le code accept="audio/*" ne soit toujours pas pris en charge sur iOS 10.3 sur mon iPhone 5S.

Update: Même histoire sous iOS 11.0.3. accept="audio/*" ne semble toujours pas pris en charge sur mon iPhone 5S.

23
Olly Hodgson

Cela ne fonctionnera pas sur un site Web, mais si vous souhaitez retravailler votre application Web dans une application mobile à l'aide de Cordova, vous pourrez utiliser l'entrée microphone. Prend quelques connaissances de l'API audio Web pour se mettre au travail.

https://github.com/edimuj/cordova-plugin-audioinput

Et RecorderJS pour enregistrer sa sortie:

https://github.com/mattdiamond/Recorderjs

Quelqu'un mentionné ci-dessus, RecorderJS ne fonctionne pas sur mobile, mais c'est le cas, c'est simplement l'entrée du micro qui ne fonctionne pas.

À ma connaissance, il n’existe actuellement aucun moyen d’enregistrer une entrée de micro dans un navigateur mobile.

2
Matt O'Tousa