上传的mp4视频无法播放HTML5播放器

时间:2016-11-28 08:58:47

标签: html5 amazon-web-services video amazon-s3 ionic-framework

我已经在我的离子移动应用中使用(aws-sdk)上传了mp4视频。 这是代码的和平。

$cordovaFile.readAsDataUrl(first, file).then(function(success) {
    AWS.config.region = 'eu-west-1';
    AWS.config.update({
                 accessKeyId: '',
                 secretAccessKey: ''
    });

    var bucket = new AWS.S3({
                     params: {
                         Bucket: 'www.bucket-new'
                     }
                 });

    var params = {
                  Key: "test.mp4",
                  ContentEncoding: 'base64',
                  ContentType: 'video/mp4', 
                  Body: success
                };

    bucket.upload(params).on('httpUploadProgress', function(evt) {
                  console.log('sucess');
                  $scope.uploading = true;
                  $scope.progress = parseInt((evt.loaded * 100) / evt.total) + '%';
                  console.log("Uploaded :: " + $scope.progress);
                  $scope.$apply();
                }).send(function(err, data) {
                  $scope.uploading = false;
                  $scope.$apply();
                });
})

视频已成功上传。但上传的视频无法在html5播放器上播放。

<video controls="controls" preload="metadata" autoplay="autoplay" webkit-playsinline="webkit-playsinline" class="videoPlayer"><source src="https://s3-eu-west-1.amazonaws.com/www.test-uploads/test.mp4" type="video/mp4"/></video>

使用aws s3 dashbord上传视频时,视频是否已在此播放器上成功播放?通过应用程序上传视频时有什么问题(使用aws-sdk)

1 个答案:

答案 0 :(得分:1)

我在这里发现了cordova文件上传插件

$ cordovaFile.readAsDataURL(路径,文件)

支持readAsDataURL函数,但Chrome中的mediatype取决于条目名称扩展名,IE中的mediatype始终为空(根据规范与text-plain相同),Firefox中的mediatype始终为application/octet-stream 。例如,如果内容为abcdefg,则Firefox返回data:application/octet-stream;base64,YWJjZGVmZw==,IE返回data:;base64,YWJjZGVmZw==,Chrome返回data:<mediatype depending on extension of entry name>;base64,YWJjZGVmZw==

更多details

然后上传的文件ID为base64 encoded。

对于上传文件,请使用此方法。 然后你可以上传视频的二进制数据。

$cordovaFile.readAsArrayBuffer(first, file)
        .then(function(success) {

---Code---

})