Amazon S3 Uploader

S3 provides a simple way of uploading files to the Amazon S3 service. This is useful for uploading images and files that you want accesible to the public. S3 is built on Knox, a module that becomes available server-side after installing this package.

This is a fork of the original work from @Lepozepo I only update this for my personal necesities.

##Improvements

• New Now you can add aditional data with oData='some data or object'.
• Specific support for images.
• Now you can add a max width and height for resize an image before send to S3.
• You have two session variables for get the upload state and the url in the client side easily.

Installation

$ mrt add s3-Images

How to use

Step 1

Define your Amazon S3 credentials. SERVER SIDE.

Meteor.call("S3config",{
	key: 'amazonKey',
	secret: 'amazonSecret',
	bucket: 'bucketName',
	directory: '/subfolder/' //This is optional, defaults to root
});

Step 2

Create an S3 input with a callback. CLIENT SIDE.

New for resize an image add max width and max height.

All in px.

{{#S3 callback="callbackFunction" height=900 width=700 oData="other optional data for use on server side"}}
	<input type="file">
{{/S3}}

Step 3

Create a callback function that will handle what to do with the generated URL. SERVER SIDE.

Meteor.methods({
	callbackFunction:function(url,imageData){
		console.log('Add '+url+' and other aditional data '+imageData);
	}
});

Other options

Two session variables.

1. Session.get('uploading'); that return true if are uploading or false if not.
2. Session.get('S3url'); that return the url of the file when it's in S3 server.

Create your Amazon S3

For all of this to work you need to create an aws account. On their website create navigate to S3 and create a bucket. Navigate to your bucket and on the top right side you'll see your account name. Click it and go to Security Credentials. Once you're in Security Credentials create a new access key under the Access Keys (Access Key ID and Secret Access Key) tab. This is the info you will use for the first step of this plug. Go back to your bucket and select the properties OF THE BUCKET, not a file. Under Static Website Hosting you can Enable website hosting, to do that first upload a blank index.html file and then enable it. YOU'RE NOT DONE.

You need to set permissions so that everyone can see what's in there. Under the Permissions tab click Edit CORS Configuration and paste this:

<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
    <CORSRule>
        <AllowedOrigin>*</AllowedOrigin>
        <AllowedMethod>GET</AllowedMethod>
    </CORSRule>
</CORSConfiguration>

Save it. Now click Edit bucket policy and paste this, REPLACE THE BUCKET NAME WITH YOUR OWN:

{
	"Version": "2008-10-17",
	"Statement": [
		{
			"Sid": "AllowPublicRead",
			"Effect": "Allow",
			"Principal": {
				"AWS": "*"
			},
			"Action": "s3:GetObject",
			"Resource": "arn:aws:s3:::YOURBUCKETNAMEHERE/*"
		}
	]
}

Enjoy, this took me a long time to figure out and I'm sharing it so that nobody has to go through all that.

Notes

I have no clue how to make a progress bar but it'll happen someday. I was able to make that work by modifying meteor-file BUT I wasn't able to use it in Modulus because their cloud storage service isn't public (so I ended up having to read the file as a base64 image which sucked for performance).