Developers have to follow these steps to setup CDN in Next JS.

Example

                                        
  • To start, we have to first set up the “assetPrefix” setting and configure our CDN origin to support resolve to the domain that our Next JS is hosted on.

            const isProd = process.env.NODE_ENV === 'production';

            module.exports = {

               // You may only need to add assetPrefix in the production.

         assetPrefix: isProd ? 'https://cdn.mydomain.com' : ''

};

  • For a CDN present on a separate domain that you may like assets to be requested with use of CORS aware request, we have to set a configuration option as following.

         // next.config.js

         module.exports = {

           crossOrigin: 'anonymous'

};

Suggest An Answer

No suggestions avaliable!