Iphone的Safari和chrome不播放视频（html5）并抛出NotsupportedError：不支持该操作

问：

我已经构建了两个脚本。一种是录制视频并将其上传到气泡服务器，其次是从上传的视频的URL播放视频。

除了 Iphones 的浏览器（Safari 和 Chrome）之外，所有平台/浏览器都运行良好。它上传成功，但在播放 Iphones 时抛出 NotsupportedError。Iphone浏览器仅在通过Iphone浏览器上传时可以完美播放。当我尝试在从 Mac/Windows PC 上传的 Iphone 浏览器中播放视频时，这只是一个问题。

我知道这一定是上传或播放脚本时的一些小修复。

脚本 1 - 录制和上传视频，

let mediaRecorder;
let cameraView;
let recordedChunks = []; // the stream data is stored in this array
instance.data.streamWebcam = await getCamera();
mediaRecorder = new MediaRecorder(stream);
        mediaRecorder.ondataavailable = function (e) {
            if (e.data.size > 0) {
                recordedChunks.push(e.data);
            }
        };
        mediaRecorder.onstop = function () {
      const blob = new Blob(recordedChunks, {
            type: 'video/mp4'
        });
        var reader = new FileReader();
        reader.readAsDataURL(blob);
        reader.onloadend = function () {
            var filename = 'video_' + (new Date()).getTime() + '.mp4';
            var base64data = reader.result;
            var uploadData = base64data.substr(base64data.indexOf(',') + 1);
            context.uploadContent(filename, uploadData, function (err, url) { //upload to the bubble database
                URL.revokeObjectURL(blob); 
            });
        }
  };
cameraView = document.createElement('video'); //create the video element
        cameraView.srcObject = instance.data.streamWebcam;
        cameraView.style.width = '100%';
        cameraView.style.height = '100%';
        cameraView.style.overflow = 'hidden';
        cameraView.style.objectFit = 'cover';
        cameraView.style.display = 'block';
        cameraView.muted = true;
        cameraView.autoplay = true;
        cameraView.playsInline = true;
cameraView.onloadedmetadata = function (e) {
            cameraView.play(); //play the video on load
        };
        instance.canvas.append(cameraView); //add element to canvas
mediaRecorder.start(200);

脚本 2 - 从 url 播放视频

let playerVideo = document.createElement('video');
            playerVideo.type = 'video/mp4'
playerVideo.style.overflow = 'hidden';
            playerVideo.style.objectFit = 'cover';
            playerVideo.style.display = 'block';
            playerVideo.src = playerVideoUrl + "#t=0.001";
            playerVideo.controls = field_showControls;
            playerVideo.autoplay = autoplayValue;
            playerVideo.muted = true;
            playerVideo.playsInline = true;
            playerVideo.style.width = '100%';
            playerVideo.style.height = '100%';
            instance.canvas.append(playerVideo);
playerVideo.play();