使用async/await后仍返回Promise而非stream，是否异步写法有误？

现有代码的核心错误点 #

• getMedia函数缺失返回值：async函数默认返回Promise对象，但你内部成功获取到媒体流后没有return该流对象，导致getMedia(constraints)执行后返回的Promise最终resolve的值为undefined，无法得到可用的流实例。
• await与then混用的语法错误：stream = await getMedia(constraints).then(stream);这行写法不符合规范，then方法需要接收回调函数作为参数，你直接传入流变量stream属于无效写法，同时已经使用await的场景下不需要额外叠加then调用，属于冗余错误代码。
• 逻辑冗余：你传入useUserMedia的streamListener回调本身已经会被注入现成的stream参数，不需要在回调内部重复调用getMedia二次请求媒体流。

修复方案 #

最优方案（去掉冗余的二次请求逻辑） #

const audioStreamer = useUserMedia({
    constraints,
    streamListener: async (stream) => {
      console.log('Streamlistener in streamcontroller line 64 abut to connect');
      console.log(`stream line 238 is ${stream}`);
      // 直接使用回调传入的stream即可
      let source = audioContext.createMediaStreamSource(stream);
      source.connect(analyser);
    },
    dataCb: (data) => socket.emit('stream', data),
  });

如果你确实需要自行调用getMedia的场景 #

先修复getMedia的返回逻辑：

async function getMedia(constraints) {
    let stream = null;
    try {
      stream = await navigator.mediaDevices.getUserMedia(constraints);
      return stream; // 新增返回获取到的媒体流
    } catch (err) {
      // 自定义错误处理逻辑
      console.error('媒体流获取失败：', err);
    }
}

再修改调用处的写法，删掉错误的then调用：

stream = await getMedia(constraints);
console.log(`stream line 240 is ${stream}`);
let source = audioContext.createMediaStreamSource(stream);
source.connect(analyser);

内容的提问来源于stack exchange，提问作者jdog