Twilio 语音 SDK javascript 在移动浏览器中不起作用：AcquisitionFailedError (31402)答案

【问题标题】：Twilio voice SDK javascript not working in mobile browser: AcquisitionFailedError (31402)Twilio 语音 SDK javascript 在移动浏览器中不起作用：AcquisitionFailedError (31402)
【发布时间】：2022-11-09 16:08:59
【问题描述】：

我有一个非常简单的 HTML 页面，将页面连接到我的 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>

当我使用 Chrome 102.0.5005.115 从我的 Windows 10 机器打开 HTML 页面时，单击呼叫按钮成功连接到我的 Twilio 后端。

但是，当我使用 Chrome 102.0.5005.125 从我的 Android 12 移动设备打开 HTML 页面时，单击通话按钮会触发以下错误：

AcquisitionFailedError (31402)：浏览器和最终用户允许权限，但获取媒体失败。这通常是由于限制不当造成的，但有时会因浏览器、操作系统或硬件问题而失败。

【问题讨论】：

标签： javascript twilio

【解决方案1】：

在设置当前设备之前尝试注册设备时，我事先遇到了这个问题。但是，由于您仅在移动设备上看到此内容，我猜这是阻止设置音频设备的权限问题。在您的手机上，您可以尝试删除浏览器的所有权限吗？然后在代码中，通过控制台记录这些设备打印出可用的输入和输出设备：

device.audio.availableInputDevices
device.audio.availableOutputDevices

刷新页面后，您的手机应提示您允许音频权限。如果没有，可能需要仔细检查您的设置。

【讨论】：

【解决方案2】：

我也遇到了同样的错误。问题是我在 HTTP（非安全）上打开网站。浏览器将阻止该站点访问您设备上的麦克风/摄像头，这就是我收到错误 AcquisitionFailedError 的地方。我的解决方案是在 HTTPS 版本上打开网站。

【讨论】：