Implementing CDN on Magento

Once you have configured your DNS, the next step is to configure the application itself to use the CDN.

Add the vhost

For your respective stack and store, add a new vost in the format "cdn.example.com" (replace example.com accordingly).

Configuring CORS headers

Cross origin headers are essential when serving static content from a different domain to that of your main website; without them the browser will actively block the requests for security.

We recommending configuring the headers on both the origin domain and the CDN domain like so,

Origin domain

At the top of example.com/___general/example.com.conf, include the existing CDN configuration to enable it. If you want to customise the headers, copy the file to a new location and include that new respective file.

# CORS
include /microcloud/domains/example/domains/example.com/___general/cdn.include.conf;

CDN domain

At the top of cdn.example.com/___general/cdn.example.com.conf, include the existing CDN configuration to enable it. If you want to customise the headers, copy the file to a new location and include that new respective file.

# CORS
include /microcloud/domains/example/domains/cdn.example.com/___general/cdn.include.conf;

Followed by an Nginx reload.

Configure the store settings

You should then update the URLs in Magento as follows,

Magento 1

Type Asset URL
Unsecure Media https://cdn.example.com/media/
Unsecure Skin https://cdn.example.com/skin/
Unsecure JS https://cdn.example.com/js/
- - -
Secure Media https://cdn.example.com/media/
Secure Skin https://cdn.example.com/skin/

Magento 2

Type Asset URL
Unsecure Media https://cdn.example.com/media/
Unsecure Static https://cdn.example.com/static/
- - -
Secure Media https://cdn.example.com/media/

We do not recommend using a CDN on the secure JS assets as this can cause issues with the checkout and the admin WYSIWYG editor.