AWS Cloudfront Streaming with signed URLs

Question

I've setup a cloudfront instance with download and streaming distributions. I set both to private with signed urls. I was able to get sample code working for the download distribution for images with signed urls. I'm now trying to get the streaming distribution working for JW Player with a signed URL but I'm having issues.

Here is my signed URL format: rtmp://s1iq2cbtodqqky.cloudfront.net/2012-08-31_13-24-01_534.mp4?Expires=1359648770&Signature=Oi8RwL4Nf338NldW2uIsqFIv3zHnJkxXYbXIiVQh~J0Iq4kb00Ly5MLTgJw~87KmlUOmilmdRHy7p~UxeGYQxgkewPI11r27se0b~hTvpxq9y9Z5C-B-A58ZnngaCi9G2SHAujMzvss7ynLLEqUV3M6MVZl1qCxyfJbLdxCIEMY_&Key-Pair-Id=

Here is my JW Player code:

<script type="text/javascript" src="jwplayer/jwplayer.js"></script>
<div id="container">Loading the player ...</div>
<script type="text/javascript">
jwplayer("container").setup({
'flashplayer': 'jwplayer/jwplayer.flash.swf',
'file': '<?= $canned_policy_stream_name ?>',
'width': '480','height': '270',
'provider': 'rtmp',
'streamer': 'rtmp://s1iq2cbtodqqky.cloudfront.net/cfx/st/'

});
</script>

Anyone know what is wrong here? How can I test the url alone? Right now it's hard to tell if the problem is the url or the code for JW Player integration.

-J

Answer 1

There a lot of gotcha's here. Took me a while to work through them when I got into it. Here are some steps I think might help a lot of people.

First here was the technology stack I went with:

• Rails 3.x
• Zencoder for encoding
• Paperclip for file upload
• Jquery Uload for upload
• JWPlayer

If that's not your platform you can fill in some of the blanks but a lot of the learning will still be useful to you.

There are a bunch of articles on how to upload content into S3 from a user so I will skip that part, the part that get's interesting is when you start the encoding process and that is really where the issues start in terms of getting signed, streamed content to play in jwplayer or flowplayer.

First, file formats - I found that MP4 and M4A were the file formats I had the most success with. With zencoder, I was able to use the out of the box mp4 and m4a export formats and get those outputs to play just fine.

1. Add you zencoder policy to the bucket before setting up the cloudfront distribution.

2. If you already have cloudfront configured, you should be careful in how you add your zencoder bucket policy into the bucket and make sure to merge it with whatever is there. Cloudfront also puts stuff in the bucket policy, you need both this and the zencoder bucket policy profile to work correctly.

3. Bucket policies only apply to files owned by the bucket owner so be sure to talk to your encoding provider to make sure they use your access key to put the files in cloudfront. If you don't have the user doing the signing the same as the user who owns the file in S3 it won't work and you will spend hours wondering why

4. Once you are sure you have your buckets setup correctly, before going further use this tool to help validate your files will actually stream (start out without signed urls and allowing cloudfront to stream files that aren't streamed. If that't not working you won't get far).

   http://d1k5ny0m6d4zlj.cloudfront.net/diag/CFStreamingDiag.html

   To use amazons tool, if your rtmp url was:

   "rtmp://s3b78u0kbtx79q.cloudfront.net/cfx/st/content/myfile.png"

   For the streaming url you want to enter:

   s3b78u0kbtx79q.cloudfront.net

   For the video file name you want to enter:

   content/myfile.png (without the leading '/')

5. Once you can actually stream your file from amazon through the diagnostics tool, now go on to following whatever steps you have from jwplayer of flowplayer.

6. A note on setting up JWPlayer (I had the fewest problems with it) while streaming - also install a debug version of flash. Now during debugging, you can right click on the flash control and change logging to 'console'. Now you will get any load errors from the flash control appearing in Firebug - so maybe test first with Firefox. Typically, when reviewing those logs, you don't want any html control characters to be escaped, escaping will typically ruin your day.

7. I imagine a lot of people doing this will want their content secure and to use signed urls (so that dubious others don't just rip your rtmp path and embed it directly into their site getting the benefit while you pay the bandwidth).I can't stress this enough, before starting down that path, make sure you first get your RTMP stream playing on publicly streamed files out of your cloudfront bucket so you know the mechanism is working.

8. If you got this far you are in a good place but now is when all the bugs can hit you, if you followed my advice above it will be a shorter day than if you missed one of the steps (like making sure your bucket policy includes your cloudfront origin id and your encoding provider writes the files with your canonical id as the owner rather than theirs).

9. Now that you have you content streaming through RTMP to a player, next you will want to get it working with signed URL's (again, so other sites can't just copy your RTMP path and play it back through their own site with jwplayer attached). In rails at least, the best way to generate a signed url is to use this gem:

   https://github.com/58bits/cloudfront-signer

   Depending on how you embed the url, you will need to use different types of escaping. If your URL doesn't play, try some the following (not very precise but if you are here and losing your hair you will try anything, if you have already tried to get this working you probably already know what I mean and won't be needing a haircut for a while):

 <%= AWS::CF::Signer.sign_path 'path/to/my/content', :expires => Time.now + 600 %> <%=raw AWS::CF::Signer.sign_path 'path/to/my/content', :expires => Time.now + 600 %> <%= AWS::CF::Signer.sign_path_safe 'path/to/my/content', :expires => Time.now + 600 %> <%=raw AWS::CF::Signer.sign_path_safe 'path/to/my/content', :expires => Time.now + 600 %> 

I probably screwed around for an hour one time before I found that using raw would fix all my problems.