Javascript 在Java脚本中录制视频后看不到曲目

<video id="video" width="640" height="480" autoplay></video>
    <div>
      <button id="startRecording">Start Recording</button>
      <button id="stopRecording" disabled>Stop Recording</button>
    </div>

    <a id="downloadLink" style="display: none">Download Video</a>
    <video width="320" height="240" controls id="videoPlayer">
      <source src="" type="video/mp4" />
      <source src="" type="video/ogg" />
      Your browser does not support the video tag.
    </video>
    <script>
      let mediaRecorder;
      let recordedChunks = [];
      const videoPlayer = document.getElementById("videoPlayer");
      var constraints = {
        audio: true,
        video: true,
      };
      navigator.mediaDevices
        .getUserMedia(constraints)
        .then((stream) => {
          const video = document.getElementById("video");
          video.srcObject = stream;

          mediaRecorder = new MediaRecorder(stream);

          mediaRecorder.ondataavailable = (event) => {
            if (event.data.size > 0) {
              recordedChunks.push(event.data);
            }
          };

          mediaRecorder.onstop = () => {
            const blob = new Blob(recordedChunks, { type: "video/mp4" });
            recordedChunks = [];
            const newObjectUrl = URL.createObjectURL(blob);
            videoPlayer.src = newObjectUrl;
            videoPlayer.play();

            const myFile = new File([blob], "demo.mp4", { type: "video/mp4" });

            const downloadLink = document.getElementById("downloadLink");
            downloadLink.href = URL.createObjectURL(myFile);
            downloadLink.download = "recorded_video.mp4";
            downloadLink.style.display = "block";
          };
        })
        .catch((error) => {
          if (error.name === "NotAllowedError" || error.name === "PermissionDeniedError") {
            console.error("User denied camera access.");
          } else {
            console.error("Error accessing camera:", error);
          }
        });

      document.getElementById("startRecording").addEventListener("click", () => {
        recordedChunks = [];
        mediaRecorder.start();
        document.getElementById("startRecording").disabled = true;
        document.getElementById("stopRecording").disabled = false;
      });

      document.getElementById("stopRecording").addEventListener("click", () => {
        mediaRecorder.stop();
        document.getElementById("startRecording").disabled = false;
        document.getElementById("stopRecording").disabled = true;
      });
    </script>