如何将.mp4或.webm录制的视频从网站发送到后端s3存储桶

Question

我正在创建一个网站来使用网络摄像头录制视频。我可以将视频成功下载到本地计算机。但是我想要的是将数据传递到后端并保存最小的AWS S3存储桶。我试图将recordblob发送到后端并将其保存到.mp4文件或.webm文件。但是从s3存储桶下载后，我无法播放它们。我还尝试打开uisng十六进制编辑器的mp4文件，复制内容，粘贴到一个空文件中，并将其命名为test.mp4。然后我发现新文件的大小不一样，无法用播放器播放。我想知道什么是传递流视频数据的正确方法。谢谢。

我的代码，用于在本地下载视频并使用API​​网关发送到后端。

// download video locally
async function downloadVideo(entryTime, name) {
  //console.log('recordedBlobs: ', recordedBlobs);
  //console.log('last 100 recordedBlobs: ', recordedBlobs.slice(Math.max(recordedBlobs.length-100, 1)));
  const blob = new Blob(recordedBlobs, {type: 'video/mp4'});
  // send blob to backend
  var fd = new FormData();
  fd.append('fname', `${entryTime}${name}.webm`);
  fd.append('data', blob);
  $.ajax({
    type: 'POST',
    url: _config.api.invokeUrl + '/video',
    headers: {
        Authorization: authToken
    },
    data: fd,
    processData: false,
    contentType: false,
    error: function(XMLHttpRequest, textStatus, errorThrown) {
        console.error('Error requesting ride: ', textStatus, ', Details: ', errorThrown);
        console.error('Response: ', jqXHR.responseText);
    }
  }).done(function(data) {

  });

  const url = window.URL.createObjectURL(blob);
  const a = document.createElement('a');
  a.style.display = 'none';
  a.href = url;
  a.download = `${entryTime}${name}.mp4`;
  //console.log('entryTime: ', entryTime);
  document.body.appendChild(a);
  a.click();
  setTimeout(() => {
    document.body.removeChild(a);
    window.URL.revokeObjectURL(url);
  }, 100);

}

以下是我的lambda函数，用于将文件保存到s3存储桶。

def lambda_handler(event, context):
# TODO implement

s3Bucket = os.environ['s3Bukect']

print(event);

message = event['body']

#print ("check message: ", type(message))
data = message.splitlines()[8:-1]
video = ''.join(data)
#print('message: ', message)
print(video)
res = True

# put itme to s3 bucket
s3 = boto3.resource('s3')
content = video
s3.Object(s3Bucket, 'test.mp4').put(Body=content)

print ("finished")

return {
        "statusCode": 201,
        "body": res,
        "headers": {
        'Access-Control-Allow-Origin': '*'
        }
}

打印出来的消息有些奇怪的迹象，如下所示：

Eߣ�B��B��B�B�B�webmB��

如何解码数据并将其保存为可以在VLC播放器中播放的格式。谢谢。