Use a Content Delivery Network

A Content Delivery Network (CDN) can be used to store media files. Although the version of Commerce that is installed on premise does not include an integration with any specific CDN, you can use the CDN of your choice. Adobe Commerce on cloud infrastructure is an exception to this, and includes the Fastly CDN. See Fastly in the Commerce developer documentation.

After configuring the CDN, you must complete the configuration from the Admin. The changes can be made at either the global or website level. When a CDN is used for media storage, all paths to media on store pages are changed to the CDN paths that are specified in the configuration.

CDN workflow

  1. Browser requests media - A page from the store opens in the customer’s browser, and the browser requests the media that is specified in the HTML.
  2. Request sent to CDN; images found and served - The request is sent first to the CDN. If the CDN has the images in storage, it serves the media files to the customer’s browser.
  3. Media not found, request sent to Commerce web server - If the CDN does not have the media files, the request is sent to the Commerce web server. If the media files are found in the file system, the web server sends them to the customer’s browser.
IMPORTANT

For security, when a CDN is used as media storage, JavaScript may not function properly if the CDN is located outside of your subdomain.

Configure a content delivery network

  1. On the Admin sidebar, go to Stores > Settings > Configuration.

  2. In the left panel under General, choose Web.

  3. In the upper-left corner, set Store View as needed.

  4. Expand Expansion selector the Base URLs section and do the following:

    General configuration - web base URLs

    • Update the Base URL for Static View Files with the URL of the location on the CDN where static view files are stored.

    • Update the Base URL for User Media Files with the URL of the JavaScript files on the CDN.

      Both these fields can be left blank, or can start with the placeholder: {% raw %}{{unsecure_base_url}}{% endraw %}

  5. Expand Expansion selector the Base URLs (Secure) section and do the following:

    General configuration - web base URLs (secure)

    • Update the Secure Base URL for Static View Files with the URL of the location on the CDN where static view files are stored.

    • Update the Secure Base URL for User Media Files with the URL of the JavaScript files on the CDN.

      Both these fields can be left blank, or can start with the placeholder: {% raw %}{{unsecure_base_url}}{% endraw %}

  6. When complete, click Save Config.

On this page