Adam Howitt's Blog

Oct 24
2007

Moving your static assets to Amazon S3

If you need a cheap host for your podcast, pdf files, site images or any of your static site assets, take a look at Amazon S3.  I've been using it since just after it launched and it's a great way to reduce bandwidth to your ColdFusion/ Application server.  For WalkJogRun my average monthly bill is just under $6, not bad for a site that has seen 27 million hits this last year.  I'll give you a quickstart guide to for using it with your site and at a later date I'll describe how to use S3.cfc to integrate S3 into your ColdFusion application to allow you to push files from your site visitors up there too.  You should be up and running in about 10 minutes or less.

To use it for your site you will need to setup an Amazon S3 account (http://www.amazonaws.com).  Once you create an account and join the Amazon S3 service, you will be shown an access key and a secret key.  Copy these down.  Before we get into copying files, you might want to add a CNAME host "s3" to your DNS records to point to S3.amazonaws.com.  This means when you are done copying files the DNS records may have been refreshed and you'll be ready to rock.  Adding a CNAME as described will make it possible for you to refer to the files you put up on Amazon S3 with http://s3.yourdomain.com/myfile.jpg for example.

To start uploading your files in the meantime:

  1. Download S3Fox for firefox https://addons.mozilla.org/en-US/firefox/addon/3247
  2. Restart firefox when it is done
  3. Go to Tools>S3 Organizer
  4. Where it says Manage account enter an account name
  5. Access Key is the access key you got when you registered
  6. Secret Key is the other part from when you registered
  7. Click close and you should see an empty directory on the right and your local filesystem on the left
  8. Right click on the right panel and click "create directory"
  9. The directory should be the CNAME you created in the DNS earlier.  So if your site is walkjogrun.net and the CNAME is s3, you should create a directory called "s3.walkjogrun.net".  Note that at the root of S3 your directory names have to be unique across the whole of Amazon's S3 userbase.  This is how they are able to do the CNAME virtual hosting.  As long as you used your own domain name and not mine, you should see a folder created when you hit OK
  10. Double click the new directory to go one level down.  This is the root used for your new subdomain so if I create a directory called images I can access them with http://s3.walkjogrun.net/images

A note on terminology is important here.  I have used the term "directory" because that is the level of abstraction provided by s3fox to make it look like an FTP service.  Amazon calls any directories in the root "buckets", and buckets are the things that have to be unique.  Anything lower than the root in a sub-directory doesn't have to have a unique name.  The technical reason for this is that, again, S3fox abstracts the complexity.  In reality, every file you upload becomes a row in a big database as a key and a value.  The key to each file you upload is the unique bucket name concatenated with a string, so by this construction each filename becomes unique too.  It's important to know this if you are going to go one step further and use S3.cfc but for now it's just a bit of extra info.

To add files to the images directory:
  1. Double click on the folder to go into it
  2. Browse in the left panel to the files you are adding
  3. Highlight the file you are adding and either right click and say upload or select multiple files and folders and hit the right arrow in the middle of the two panels
  4. Once you see the files have all uploaded below, go up to a directory to the /s3.yourdomain.com/ directory
  5. Right click on the directory and hit "edit acl"
  6. Ensure that "everyone" has read permissions and check "apply to subfolders"

Any file uploaded to the images directory would then be available under s3.yourdomain.com/images/myimage.jpg etc.  You can right click any file in the right panel and select "Copy URL to clipboard" then paste it into your browser to see if it worked.  

That's it!  Other uses for the service are that you can backup files off your laptop or use it to host large design proofs that would take forever on your local machine.  Did I tell you how fast it is?  WalkJogRun images load 10X faster from Amazon under load than off my humble 10Mb/sec cable connection!

Comments (Comment Moderation is enabled. Your comment will not appear until approved.)
[Add Comment] [Subscribe to Comments]
  1. how odd, just lastnight i signed up for an s3 account, I was using JungleDisk as it provides a drive mapping to the s3 area - i can see massive potentials for this!

    didn't know about s3fox! Neat!

  2. Hi John, yeah - it's crazy cheap and fast and well worth kicking the tires, even if you just use it to backup your machine. For those of you not in the know, JungleDisk takes S3Fox one step beyond giving you a mapped drive on your machine you can copy to. The advantage of this is that you can have scheduled tasks to copy files up.

    I was thinking about writing a directory listener with CF that looks for changes and then uploads changed or new files to S3. Anyone be interested in that?

  3. >> I was thinking about writing a directory listener with CF that looks for changes and then uploads changed or new files to S3. Anyone be interested in that? <<

    Ummm heck yeah! I've been wanting to do something like that for months. No time!

    Let me know if it comes to life.

    Thanks!

  4. Yeah I used if to host all user uploaded files for a site I did... http://www.buyfromachristian.com It is nice because I don't have to worry about backing them up and our current bill is $0.27 a month.

  5. Is there any way to call S3 assets securely when your webpage is currently in secure mode using SSL? Some of the bottleneck that we experience is when a new item launches... I'd like to be able to call all of the S3 hosted images in securely so that the customers don't get a security alert in their browser. Is there anyway to do this?

  6. FYI: Macromedia allows you to use their secure domain name as the object codebase when embedding flash into a secure page so that your visitors don't get a security alert.

    Hopefully there's a way to do this with S3 too.

  7. James,

    Actually they do...

    So for this site I setup a CNAME called images.buyfromachristian.com and my bucket is called images.buyfromachristian.com...

    so when the site is in SSL mode I do...

    https://s3.amazonaws.com/images.buyfromachristian.com/img-1041-75x75.jpg

    and that will use their cert and not get an error.

    -J.J.

  8. Hi James, J.J. is right. If you try to use the CNAME approach of using https://s3.mydomain.com/images/image.jpg You will get warnings to say that this cert belongs to s3.amazonaws.com, but you're accessing it via s3.mydomain.com. Using the standard s3 name and your bucket name will allow you to get around the issue as J.J. points out. @JJ - thanks for great tip!

  9. Awesome. That's what I was going to test, but I was working on something else and someone else was working on it and stated that SSL was issuing an error.

    Anyone find any decent programs that allow you to easily upload web-accessible assets besides Firefox? (Some programs will map a drive and synch nicely, but they appear to be secure backups and not web accessible.)

    I found this and it's pretty nice: S3 Webmaster (beta) http://www.maluke.com/blog/s3-webmaster-10-rc3

    I'd still like to find a decent FTP-like program that is capable of comparing filedates/filesize and updating only if necessary. I use SyncBack and have lots of other projects that are automatically updated in the background. S3 Webmaster and S3 Firefox add-on don't do any comparisons and have to be manually inspected and re-uploaded. It doesn't need to be CF either. (I prefer to remove non-critical file tasks from web applications whenever possible.)

  10. A comment: You recommend making the cname point to S3.amazonaws.com. However, the docs (http://docs.amazonwebservices.com/AmazonS3/2006-03-01/dev/VirtualHosting.html#VirtualHostingCustomURLs) say to use: cname.s3.amazonaws.com

    where cname is your cname of course.

  11. Hi Ray - thanks for the comment. The post is 2 years old so things might have shifted but as far as I know there are two ways to set this up and I've used both within the last month. The first is to create a bucket matching your FQDN so for example s3.webdevref.com would be my bucket name. Setting the CNAME for s3.webdevref.com to point at s3.amazonaws.com will work since your bucket name is unique. This may be a deprecated approach but it still works... The other approach is to point your CNAME for s3.webdevref.com.s3.amazonaws.com. The benefit of the second approach is that don't need to make your bucket name the FQDN and can even point two CNAMEs at the same bucket e.g. if your bucket was called wdrcommonassets you could have s3.webdevref.com and s3.knowmysize.com point at the same set of assets by setting their CNAME entries to point at wdrcommonassets.s3.amazonaws.com. I discovered this when I tried to point one cname at the bucket and the second cname at the first cname. It didn't work because the second cname, let's say it was s3.walkjogrun.net, was getting passed through to amazon where it looks for the bucket name s3.walkjogrun.net and not finding a match whereas the first CNAME, say s3.webdevref.com, was the only one pointed at the cname.s3.amazonaws.com format and the only one of the two that worked. Bottom line, both approaches work but the new approach of cname.s3.amazonaws.com seems more flexible and if it's in the docs it's supported :-)

[Add Comment]