Cloudinary provider

The Media Library feature is powered by a back-end server package called Upload which leverages the use of providers.

Strapi maintains 3 providers for the Media Library. The present page is about the Cloudinary provider installation and configuration. For other providers, please refer to the list in the Media Library Providers page.

Installation

To install the official Strapi-maintained Cloudinary provider, run the following command in a terminal:

Yarn

yarn add @strapi/provider-upload-cloudinary

NPM

npm install @strapi/provider-upload-cloudinary --save

Configuration

Providers configuration are defined in the /config/plugins file. If this file does not exist, you must create it. The provider configuration accepts the following entries:

• provider to define the provider name (i.e., cloudinary)
• providerOptions to define options that are passed down during the construction of the provider (see Cloudinary documentation for the full list of options)
• actionOptions to define options that are passed directly to the parameters to each method respectively. The Official AWS documentation lists available options for upload/uploadStream and delete.

JavaScript

/config/plugins.js

module.exports = ({ env }) => ({
  // ...
  upload: {
    config: {
      provider: 'cloudinary',
      providerOptions: {
        cloud_name: env('CLOUDINARY_NAME'),
        api_key: env('CLOUDINARY_KEY'),
        api_secret: env('CLOUDINARY_SECRET'),
      },
      actionOptions: {
        upload: {},
        uploadStream: {},
        delete: {},
      },
    },
  },
  // ...
});

TypeScript

/config/plugins.ts

module.exports = ({ env }) => ({
  // ...
  upload: {
    config: {
      provider: 'cloudinary',
      providerOptions: {
        cloud_name: env('CLOUDINARY_NAME'),
        api_key: env('CLOUDINARY_KEY'),
        api_secret: env('CLOUDINARY_SECRET'),
      },
      actionOptions: {
        upload: {},
        uploadStream: {},
        delete: {},
      },
    },
  },
  // ...
});

Notes

• Strapi has a default security middleware that has a very strict contentSecurityPolicy that limits loading images and media to "'self'" only, see the example configuration on the provider page or the middleware documentation for more information.
• When using a different provider per environment, specify the correct configuration in /config/env/${yourEnvironment}/plugins.js|ts (see environments).