web-dev-qa-db-fra.com

Enregistrement vocal sur iPhone en utilisant Safari et HTML5

Je suis en train de développer une application Web simple qui enregistre uniquement une voix à partir du microphone, mais j'ai quelques problèmes.

La fonction d'enregistrement vocal HTML5 fonctionne bien sur chrome et firefox desktop ou Android. Mais tout en utilisant les navigateurs mobiles sur iPhone même chrome et firefox cela ne fonctionne pas).

J'ai essayé recorder.js et le résultat n'a pas changé.

Est-il possible d'enregistrer de la voix sur safari ou est-ce une fonction manquante de safari ou iOS?

11
Abdüssamet ASLAN

Pour autant que je sache, même sur le dernier iOS (iOS 10), l'enregistrement de la voix sur iOS en utilisant HTML5 est toujours impossible. Étant donné que tous les navigateurs sur iOS sont limités à utiliser UIWebView que Safari sur iOS utilise également, Chrome sur iOS ne peut prendre en charge aucune API pouvant être utilisée pour l'enregistrement multimédia.
Par exemple, recorder.js que vous avez utilisé est construit sur Media Capture API. Si vous cochez caniuse.com , vous constaterez que cette API n'est pas prise en charge sur iOS. (Vérifiez également le problème ici ).
MediaRecorder API est également une API prometteuse mais non prise en charge par le navigateur d'Apple.

Consultez les réponses ci-dessous pour plus d'informations.
1. Enregistrer la voix depuis IPhone en utilisant HTML5
2. Enregistrement audio html5 sur iOS

11
choasia

Depuis iOS11, Safari prend désormais en charge l'API Media Capture:

Nouveau dans Safari 11.0 - Accès à la caméra et au microphone.

Ajout de la prise en charge de l'API Media Capture. Ajout de la possibilité pour les sites Web d'accéder aux flux de caméras et de microphones à partir de l'appareil d'un utilisateur (l'autorisation de l'utilisateur est requise.)

Annonce par Apple - lien rompu en juillet 2018

ne copie de l'annonce sur le blog de quelqu'un

C'est pourquoi recorder.js fonctionnera maintenant.

11
K48

Mise à jour de mai 2018 (car comprendre cela a été difficile avec toutes les informations obsolètes).

J'ai trouvé cette démo qui prouve que c'est possible: https://kaliatech.github.io/web-audio-recording-tests/dist/#/test1

8
haberdasher

C'est maintenant possible et "facile" à faire sur iOS11 pour Safari! L'API mediaStream est désormais prise en charge. L'API mediaRecorder ne l'est pas. Cela empêche tous les exemples existants de fonctionner. Vous devrez donc implémenter votre propre fonctionnalité mediaRecorder en connectant le flux multimédia à un webkitAudioContext ScriptProcessorNode et collecter le tampon de flux sur l'événement onaudioprocess du nœud. Vous pouvez ensuite collecter les données audio en streaming du microphone iOS et en faire ce que vous voulez, très probablement en les fusionnant dans un fichier wav pour le téléchargement/téléchargement. Cela fonctionne pour tout navigateur prenant en charge l'API Media Stream.

Deux pièges:
- iOS Safari aime désallouer tout AudioContext qui n'a pas été créé sur le thread principal (sur un robinet) afin que vous ne puissiez pas l'initialiser sur le rappel de l'accès multimédia de l'appareil accepté.
- Le scriptProccessorNode ne déclenchera aucun événement audioprocessé à moins que l'entrée ET la sortie ne soient connectées pour une raison quelconque.

7
Vincent Fitzgerald

Safari sur iOS 11 ne prend PAS en charge les 2 normes qui rendraient l'enregistrement audio (uniquement) possible (et facile à mettre en œuvre):

  • HTML Media Capture pour l'audio ( spec , syntaxe correcte ) - l'enregistrement audio doit être transmis à une application native qui devrait transmettre le résultat au navigateur pour le téléchargement (cela fonctionne pour la vidéo et l'image)
  • API d'enregistrement MediaStream ( spec , demo ) - vous permet d'enregistrer sur un blob directement dans le navigateur. L'enregistrement peut être téléchargé ou téléchargé sur un serveur Web.
1
Octavian Naicu