Upload video files into S3 bucket (React js)

user_10118996 0
Viewed 6632

How to upload video files into S3 bucket using React JS. I am currently developing a React JS application and I have to upload video files into S3 bucket. I searched a lot but I can only find out "Image" uploading part. But I would like to know how to upload video files into S3 bucket (effective way). If anyone knows that please share your answers.

Thanks in advance.

reactjs amazon-web-services amazon-s3
2 Answers

Technically speaking, uploading a video is just like uploading any binary file (e.g. Image, audio file ... etc). However, because those video files can get too big quickly so I'd suggest you utilize one or more of the following:

  • Multipart upload: Highly recommended if the file is above 100MB. It will help you reach higher throughput, the ability to resume interrupted uploads and pausing and resuming uploads. Read more here.

  • S3 Transfer Acceleration: Using a CDN users will be uploading to a geographically closer location which will also speed things up for them. Read more here.

Some helpful libraries to checkout: EvaporateJS, react-s3-uploader-multipart

user_17722450

Use the multer-s3 node package as it used in this tutorial: https://www.youtube.com/watch?v=ASuU4km3VHE&t=3s

and add the contentType: multerS3.AUTO_CONTENT_TYPE to the multer object like so.

var upload = multer({
  storage: multerS3({
    s3: s3,
    bucket: 'some-bucket',
    contentType: multerS3.AUTO_CONTENT_TYPE,
    metadata: function (req, file, cb) {
      cb(null, {fieldName: file.fieldname});
    },
    key: function (req, file, cb) {
      cb(null, Date.now().toString())
    }
  })
})

This will set the Content-type metadata to video/quicktime for the bucket object when you upload a video file. These video objects can be played back using a media player and the object url from s3.

user_133998790
Related