Tengo una página HTML muy simple que conecta la página con mi backend de Twilio:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> <script src="https://cdn.jsdelivr.net/npm/@twilio/voice-sdk@2.0.1/dist/twilio.min.js"></script> <script> connection = null; call = async () => { const response = await fetch( "https://my.token.endpoint/token" ); const data = await response.json(); const device = new Twilio.Device(data.token); connection = await device.connect(); connection.on( "error", (err) => (document.getElementById("error-display").innerHTML = err.message) ); }; stop = () => { connection?.disconnect(); connection = null; }; </script> </head> <body> <button onclick="call()">call</button> <button onclick="stop()">stop</button> <p id="error-display"></p> </body> </html>Cuando abro la página HTML desde mi máquina con Windows 10 usando Chrome 102.0.5005.115, al hacer clic en el botón de llamada se conecta con éxito a mi backend de Twilio.
Sin embargo, cuando abro la página HTML desde mi dispositivo móvil Android 12 con Chrome 102.0.5005.125, al hacer clic en el botón de llamada se genera el siguiente error:
AcquisitionFailedError (31402): el navegador y el usuario final permitieron los permisos, sin embargo, falló la obtención de los medios. Por lo general, esto se debe a malas restricciones, pero a veces puede fallar debido a problemas con el navegador, el sistema operativo o el hardware.