从s3提取后如何在浏览器中播放视频文件？

Question

我想从s3存储桶中获取视频后再在浏览器中播放视频。我正在使用aws的getObject API来获取文件。我从s3接收到的文件主体具有无法在浏览器中流式传输的数组缓冲区。

我尝试将unit8Array转换为base64编码的字符串以获取URL。

downloadVideo() {
    var AWS_BUCKET_NAME = this.props.awsService.bucket;
    var $this = this;
    var bucket = new AWS.S3({params: {Bucket: AWS_BUCKET_NAME}});
    bucket.getObject({Key: this.props.fileName},function(err,file){
        if(err) {
            console.log('err : ', err);
        } else {
            console.log('file : ', file); 
            var srcUrl = "data:video/mp4;base64," + $this.encode(file.Body);
            $this.setState({fileSrc: srcUrl});
        }
    });
}

encode(data){
    var str = data.reduce(function(a,b){ return a+String.fromCharCode(b) },'');
    return btoa(str).replace(/.{76}(?=.)/g,'$&\n');
}

但是，对于大型视频，正在形成的网址非常大，一段时间后视频崩溃。 我将附加从s3接收到的文件对象的屏幕快照，以供参考。

是否有一种无需下载即可直接流式传输视频的方法？

Answer 1

如您所知，对视频进行

base64编码非常浪费且效率低下。您可以尝试这样的事情：

var blob = new Blob([file.Body.buffer]);
var srcUrl = URL.createObjectURL(blob);
$this.setState({fileSrc: srcUrl});