0
98
VistasGrabar audio solo con Videojs-record sin wavesurfer
Estoy usando Videojs y Videojs-record en mi aplicación Rails para crear mensajes y capturar videos y pantallas desde el navegador de los usuarios. Estoy creando una interfaz de usuario personalizada usando tailwindcss y estoy usando Stimulusjs para manejar todos los clics de botón, etc.
En lugar de usar los controles dentro del reproductor Videojs para obtener los dispositivos, tengo un botón que llama a una acción en mi controlador de estímulo.
startCapture() { let options = { // video.js options controls: false, bigPlayButton: true, loop: false, fluid: true, plugins: { // videojs-record plugin options record: { audio: true, video: { width: { min: 640, ideal: 852, max: 1280 }, height: { min: 480, ideal: 480, max: 720 } } } } } player = videojs(this.previewMediaTarget, options, () => { console.log("Videojs-record is ready") } }Esto funciona muy bien cuando quiero grabar video y pantalla/audio (con algunas modificaciones en las opciones), pero también quiero darles a mis usuarios la capacidad de crear mensajes de audio.
Cuando cambio las opciones de mi reproductor para
audio: true, video: falseVideojs-record automáticamente intenta usar la biblioteca wavesurfer con los complementos videojs-wavesurfer y micrófono.
La biblioteca de wavesurfer es excelente y no me opondría a usarla, sin embargo, el player.record().getDevice() Videojs-record no funciona cuando lo uso y, en cambio, parece que me obliga a hacer clic en el botón grande para habilitar el micrófono. 
He intentado encontrar un método similar a player.record().getDevice() para habilitar el micrófono de los usuarios desde wavesurfer.js y conectar el micrófono, pero no he tenido suerte.
¿Hay alguna manera de que solo player.record().getDevice() y solo obtenga el micrófono de los usuarios sin tener que usar el complemento wavesurfer? ¿O hay un método videojs-wavesurfer que no he encontrado que me permita usar un botón personalizado para getDevice ? ¡Gracias!
1 Respuestas
Responde la pregunta0
Me lo imaginé.
Primero, no hay forma de no usar wavesurfer solo con audio de grabación de Videojs, pero descubrí cómo usarlo en mi proyecto.
El problema con el que me estaba encontrando era que estaba tratando de configurar las opciones del reproductor y construir el reproductor al activar mi acción Stimulus, así que después de cargar el controlador. Esto estaba causando que WaveSurfer.microphone.create() no se inicializara. Resolví el problema moviendo las opciones a la acción de connect() para que el reproductor se construya cuando se carga el controlador de estímulo. Luego, en mi acción, llamo a player.record().getDevice() y todo funciona perfectamente.