How to use AWS S3 as Customer Origin for HLS videos

Hello AWS!

Finally I use the famous Amazon Web Service. I use AWS Simple Storage Service (S3) to test something about online videos.

Why AWS?

  1. Web server support of Cross-Origin Resource Sharing (CORS) is a common requirement for video players.
  2. AWS is a popular platform. I don’t know how to set up Cross Origin Resource Sharing (CORS) on my existing hosting provider GoDaddy. While there are more Google results about “AWS S3 CORS”.
  3. AWS offers free trial. Many AWS services are free at low volume usages. S3 is free is usage is less than 5GB & 20000 Get Request & 2000 Put Request per month.
  4. GoDaddy becomes more difficult to use. GUI becomes more chaotic and slow!

There are many motivations for me to use AWS. The remaining question is learning curve. I spend sometime of the recent Chinese New Year holidays studying how to use AWS as customer origin for HLS videos. It was quite easy and interesting to learn and use AWS.

And now I am thinking to move my demo sites from GoDaddy to AWS!

Lesson learnt: cloud service provider should provide user-friendly support information and free trial to help people to become its users.

Since HLS is not supported by many desktop browsers, I need to use a video player to help desktop users to view my testing HLS videos. I pick Flowplayer because there is good support information (adequate and useful for me) and it is free (again)!

I created two S3 buckets, one for html files and one for video content. Serve-side CORS support is required by Flowplayer. I used the suggestions from an AWS doc and a StackOverflow discussion (see the online resources below). I verified Access-Control-Allow-Origin response header was returned by AWS S3 by the command curl -sI -H "Origin:" -H "Access-Control-Request-Method: GET"

Below was the command output:

HTTP/1.1 200 OK
x-amz-id-2: ufXH6929lMlXDveTkzj1IDPW1Q1q0/LtW/joHnui0LBM7l0TQ/hNQ59+0mxLUPGjPoBqyxBcopg=
x-amz-request-id: 37DE725CA5A9B471
Date: Sat, 20 Feb 2016 18:32:20 GMT
Access-Control-Allow-Methods: HEAD, GET
Access-Control-Expose-Headers: Content-Range, Date, Etag
Access-Control-Max-Age: 600
Access-Control-Allow-Credentials: true
Vary: Origin, Access-Control-Request-Headers, Access-Control-Request-Method
Last-Modified: Sat, 20 Feb 2016 18:31:34 GMT
ETag: "53252b004b38563c1afdd13a3647b7fa"
Content-Type: text/html
Content-Length: 581
Server: AmazonS3

Moreover, I wrote a simple crossdomain.xml file suggested by FlowPlayer, uploaded it to the video content bucket. With all these, my new testing site is now up and running! I use iPhone, Android 5+ device and MacBook (Safari, Chrome and Firefox) to check browser compatibility.

I am not going to re-invent the wheel. Please find below the online resources I find very useful about how to use AWS S3 as customer origin for HLS videos!

Shalom! Wish you have a great Friday evening!

PS: My CDN demo site will be under re-construction and not available between 26-Feb and 11-Mar.

One Comment on “How to use AWS S3 as Customer Origin for HLS videos”

  1. […] I use AWS S3 to keep the HLS files. More information at my previous post How to use AWS S3 as Customer Origin for HLS videos […]

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.