Image uploads with Rails, Refile, s3 and Cloudfront CDN


Published: September 08, 2015

Category: Ruby on Rails

Refile is the new kid on the block for managing file uploads in Ruby on Rails. Created by Jonas Nicklas , it adds further features to his popular project Carrierwave. It is advisable to place a CDN (content delivery network) in front of your app when serving images from remote storage to aid performance, and our online tutorial breaks down in step-by-step fashion exactly how to integrate this.

Get an Amazon Web Services account from here and open a s3 bucket, this is essentially free to start with.

Create your rails app with a Product model with name attribute, and a postgres database in development.

Essential - In your .gitignore file, add:

/config/secrets.yml

This is one step you can take to prevent your AWS credentials from being publicised which will inevitably lead to your account being compromised and a massive bill as multiple spot EC2 instances appear in numerous worldwide locations...Do not push your code to a public repository before this step.

Follow the instructions to install the Refile gem and adjust the Product model, form, views and database as per the guidance.

You should now have a working file upload function, which will upload and display files from tmp/uploads/store. As this is only a temporary store, we want to change this to point to our s3 bucket. Again, following the instructions in the guide, install the gem:

gem "refile-s3"

Configure the secrets.yml file with your AWS credentials

secret_key_base: <%= ENV["SECRET_KEY_BASE"] %>
  access_key: 'AWS_ACCESS_KEY'
  secret_key: 'AWS_SECRET_KEY'
  region: 'AWS_REGION'
  bucket: 'AWS_BUCKET'

Create a refile.rb file in config/initializers directory.

# config/initializers/refile.rb
require "refile/s3"

aws = {
  access_key_id: Rails.application.secrets.access_key,
  secret_access_key: Rails.application.secrets.secret_key,
  region: Rails.application.secrets.region,
  bucket: Rails.application.secrets.bucket,
}
Refile.cache = Refile::S3.new(prefix: "cache", **aws)
Refile.store = Refile::S3.new(prefix: "store", **aws)

Restart the server, we should now be able to continue uploading files, and see them appear in our s3 bucket/store.

Serving files via Cloudfront CDN in production.

In order to improve performance with the Refile gem, we can utilize Amazons CDN with a few simple steps.

Create a cloudfront distribution in the Amazon management console.

Click "Distribution Settings", then "Origins".

Alter the Origin Domain Name which would normally point to your AWS bucket to point to your production url, my_app.com.

In config/initializers/refile.rb, add the cloudfront distribution domain name to the file as Refile.host, it is found under the General tab, and ends in cloudfront.net:

#cloudfront distribution domain name
Refile.host = '//some_text_and numbers_here.cloudfront.net'

Don't forget the double forward slashes at the start of the string.

UPDATE: There are now two separate host settings, Refile.app_host which affects all URLs generated by Refile, and Refile.cdn_host, which only affects file_url and attachment_url.

For our CDN set up, you should only set Refile.cdn_host.

The regular Refile.host is now deprecated, to prevent confusion.

Back to News

GET SEO NEWS AND UPDATES SENT DIRECTLY TO YOUR INBOX. SIGN UP TO OUR NEWSLETTER

No Thanks, I have enough traffic already!


google certified SEO agency
Copyright ©2017 8Ball DigitalTM 163 Treffry Rd, Truro, Cornwall TR1 1UF