Как воспроизвести видео файл в браузере после загрузки с s3?

Question

Я хочу воспроизвести видео в браузере после загрузки его из корзины s3.Я использую API getObject для получения файла.Тело файла, которое я получаю от 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');
}

Однако для большого видео формируемый URL очень большой, и через некоторое время видео вылетает.Я прилагаю скриншот файла объекта, полученного от s3 для справки.

Есть ли способ прямой потоковой передачи видео без загрузки?

Answer 1

base64-кодирование видео очень расточительно и неэффективно, как вы заметили.Вы можете попробовать что-то вроде этого:

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