This tutorial will cover the steps required to configure Amazon AWS CloudFront CDN with your Magento website. We will also cover CDN Cache Busting to ensure your customers are seeing the latest version of your content, without needing to manually purge CDN cache or wait for the assets to expire.

This tutorial is relevant for and applicable to:

  • Magento 1 Community (CE) & Enterprise (EE)
  • Magento 2 Open Source and Commerce

What you will need

The first thing you will need is an Amazon AWS account. If you don’t have one, click this link to register for free with Amazon Web Services.

If you want to use a custom domain for your CDN assets then you will also need access to your DNS management, eg. AWS Route 53,,, etc.

CDN Custom Domain

There are two choices for serving your assets via CloudFront:

  • CloudFront Domain: all assets will be served from
  • Custom Domain: assets can instead be served from something like and

There are some limitations on the latter and it requires a little more configuration, but generally speaking it is the recommended option.

If you opt for the CloudFront domain you can skip this next section and proceed straight to ‘Configure AWS CloudFront’.

AWS ACM SSL Certificate

To serve HTTPS assets via your Custom Domain you will need an AWS Certificate. Within your AWS account, navigate to Services > Certificate Manager.

Important: you must change your location to US East (N. Virginia), which can be done by selecting the location dropdown in the top right of the screen. Only certificates registered in this location can be used with CloudFront.

Click the button ‘Request a Certificate’ and enter your three domains: the primary, static and media (the primary domain is not actually required, but makes the UI easier to understand later when selecting your certificate), eg.


When you click the ‘Review and request’ button and then the subsequent ‘Confirm and request’ button an email will be attempted to a number of emails, eg.

You must open each of the emails received and click the link included to confirm that you are the owner of the domain name.

Once the above is complete, navigate once again to Services > Certificate Manager and you should now have a certificate with Status ‘Issued’. This certificate is now ready for use with CloudFront.

Configure AWS CloudFront

Within your AWS account, navigate to Services > CloudFront. Click the button that says ‘Create Distribution’ and then on the next page, click the ‘Get Started’ button under the ‘Web’ section.

There are a number of ways to configure your CDN and you are free to explore these once up and running. For the sake of this tutorial we will stick mostly to the defaults, so if an option is not mentioned below you can leave it as-is:

  • Origin Domain Name: this is the domain of your Magento website, eg.
  • Origin Protocol Policy: Match Viewer
  • Default Root Object: enter the path to your company logo, eg. /static/frontend/Magento/luma/en_GB/images/logo.svg

If you want to use a Custom Domain for the CDN then there are a few more values to complete:

  • Alternate Domain Names (CNAMEs): we need a value for static and media content, eg.,
  • SSL Certificate: select the certificate you created in the previous step

When you are finished, click on the ‘Create Distribution’ button at the bottom. AWS will now take some time to fully provision your CDN Distribution. If you return to the ‘CloudFront Distributions’ screen you will see the Status of your Distribution, which will be ‘In Progress’. When this becomes ‘Deployed’ it is ready for use.

Note: If you attempt to access CDN data via an HTTPS link on a custom domain before the Status is ‘Deployed’, you will likely see an Untrusted SSL Certificate warning. Please wait until your Distribution is ‘Deployed’ and try again.

Custom Domain DNS

This section can be skipped if you opted for the CloudFront Domain in the CDN Domain Options section.

Take a look at your new Distribution and you should see you now have a CDN URL that will look something like Take a note of this value.

Open up the DNS management tool and add two new CNAME records for and to point at your value.

This may take a short while to propagate depending on your DNS provider.

The waiting game…

If you selected CloudFront Domain for your CDN Domain Option then you can skip this step.

There may be a short time where you are waiting for your CDN Distribution and/or DNS propagation, so don’t change anything in Magento just yet as the website may appear OK to you but not to others in different locations.

The best way to check whether everything is ready or not is to try accessing until you see your logo and no security warnings. I’d recommend waiting at least an hour before proceeding.


Since your assets, such as fonts or JavaScript files, are going to be served from a third party domain, you need to ‘allow’ ‘access’ to that asset from your website ‘origin’. This is quite simple and involves adding a rule to your nginx or apache configuration:

Access-Control-Allow-Origin: '*'

This will allow the CDN to access your assets and avoid any errors in your console, missing fonts, styles, etc. Please see the article CORS in Magento 2 for further information about configuring Access-Control-Allow-Origin.

Magento System Configuration

The next step is to update your Magento system configuration to point at the new CDN URLs.

If you would like Admin Panel assets to also be served via CDN then you should configure these settings at Default Store scope. Alternatively if you would prefer the Admin Panel to not use CDN, which can be safer if you unsure, then make the change at Website scope.

Note: It is a good idea to test this using only media URLs first and check for any unexpected results on the frontend. Changing the static URL will effect JavaScript and CSS, making it more difficult to revert any changes.

Magento 1.x

Login to Magento and navigate to System > Configuration > Web.

  • Unsecure > Base Skin URL:
  • Unsecure > Base Media URL:
  • Unsecure > Base JavaScript URL:
  • Secure > Base Skin URL:
  • Secure > Base Media URL:
  • Secure > Base JavaScript URL:

Custom Domain:

  • Unsecure > Base Skin URL:
  • Unsecure > Base Media URL:
  • Unsecure > Base JavaScript URL:
  • Secure > Base Skin URL:
  • Secure > Base Media URL:
  • Secure > Base JavaScript URL:

Magento 2.x:

Login to Magento and navigate to Stores > Settings > Configuration > Web, and update the following fields:

CloudFront Domain:

  • Base Urls > Base URL for Static View Files:
  • Base Urls > Base URL for User Media Files:
  • Base Urls (Secure) > Base URL for Static View Files:
  • Base Urls (Secure) > Base URL for User Media Files:

Custom Domain:

  • Base Urls > Base URL for Static View Files:
  • Base Urls > Base URL for User Media Files:
  • Base Urls (Secure) > Base URL for Static View Files:
  • Base Urls (Secure) > Base URL for User Media Files:

CDN Cache Busting

Now that you have your Magento instance up and running with CloudFront CDN, or any CDN for that matter, you have a little less control over what version of your images, css and javascript files your customers are seeing.

You can implement cache lifetimes and even login to the CDN and trigger a cache purge, however there is a better way to take complete control and allow for instant clearing of your CDN cache, with the Absolute CDN CacheBust extension.

This extension allows you to use dynamic URLs for your CDN assets, and at the click of a button, or via a command line script, instantly bust your CDN cache ensuring your customers are seeing the latest version of your assets, straight away.

Click here to find out more about the Absolute CDN CacheBust extension.

Article originally published on the Absolute Commerce website.

Published by Joseph McDermott

A certified Magento solution specialist with twelve years experience leading ecommerce development projects, converting complex problems into elegant technical solutions.

Leave a comment

Your email address will not be published.

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