将音频直接从浏览器流式传输到服务器

Question

我想在用户点击 Record 后立即开始上传从麦克风录制的音频，而不是等到他们完成。这可以通过浏览器 JavaScript 实现吗？

我尝试这样做只是为了开始，但只要录音机正在录音，请求就会立即结束，而不是继续。

客户端（浏览器）代码

navigator.mediaDevices.getUserMedia({ audio: true }).then(
  (stream) => {
    const recorder = new MediaRecorder(stream)

    recorder.onstart = async () => {
      await fetch("/stream/upload", {
        method: "POST",
        headers: { "Content-Type": "multipart/form-data" },
        body: stream,
        allowHTTP1ForStreamingUpload: true,
      })

      console.log("Upload complete!")
    }
  },
  (err) => console.error("Error: " + err)
)

服务器代码

const app = express()

app.post("/stream/upload", (req, res, next) => {
  res.status(200)

  req.on("data", (chunk) => {
    // only appears once
    console.log("Data received")
    res.write(chunk)
  })

  req.on("end", () => {
    // and then this appears immediately after
    console.log("Stream ended")
    res.send("Ended")
  })
})

Answer 1

val qqqHeir = Qqq() qqqHeir.inQqq.funInQqq("S") 仅在录制开始时调用 - 您需要将数据作为 dataavailable event 的一部分上传 - 为了使该事件更频繁地发生，请使用 onstart 参数timeslice 方法。

话虽如此，根据底层用例，使用 WebRTC 将音频内容流式传输到服务器可能会更好地为您服务。