File upload failure to Cloudinary using strapi v4

Questions and Answers
1
System Information
  • Strapi Version: strapi v4
  • Operating System: ubuntu.20.04.3
  • Database: SQlite
  • Node Version: 6.13.1
  • NPM Version: 8.1.2
  • Yarn Version: 1.22.17

it’s my fists time using strapi with Cloudinary and I’m having issues of images getting uploaded into /public/uploads/ folder rather than uploading to Cloudinary storage service.
as shown below
“url”: “/uploads/thumbnail_myphoto_46806d2062.jpg”

Please let me know if I am doing it the wrong way cause I have I’ve tried all possible solution & failed.

plugins.js

module.exports = ({ env }) => ({

    upload: {
        provider: 'cloudinary',
        providerOptions: {
            cloud_name: env('CLOUDINARY_NAME'),
            api_key: env('CLOUDINARY_KEY'),
            api_secret: env('CLOUDINARY_SECRET'),
          
        },
        actionOptions: {
            upload: {},
            delete: {},
        },
    },

});

package.json

  "devDependencies": {},
  "dependencies": {
    "@strapi/plugin-i18n": "4.0.0",
    "@strapi/plugin-users-permissions": "4.0.0",
    "@strapi/provider-upload-cloudinary": "^4.0.0",
    "@strapi/strapi": "4.0.0",
    "pg": "^8.7.1",
    "pg-connection-string": "^2.5.0",
    "sqlite3": "5.0.2"

middlewares.js

  module.exports = [
  'strapi::errors',
  {
    name: 'strapi::security',
    config: {
      contentSecurityPolicy: {
        useDefaults: true,
        directives: {
          'connect-src': ["'self'", 'https:'],
          'img-src': ["'self'", 'data:', 'blob:', 'res.cloudinary.com'],
          'media-src': ["'self'", 'data:', 'blob:', 'res.cloudinary.com'],
          upgradeInsecureRequests: null,
        },
      },
    },
  },
  'strapi::cors',
  'strapi::poweredBy',
  'strapi::logger',
  'strapi::query',
  'strapi::body',
  'strapi::favicon',
  'strapi::public',
];

.env

CLOUDINARY_NAME = xxxxxxxxxxx
CLOUDINARY_KEY = xxxxxxxxxxx
CLOUDINARY_SECRET = xxxxxxxxxxx

1 Like
2

I’m getting the same thing. Please Help

3

Check this out guys, found this solution on the other thread

1 Like
4

thanks, @devinekadeni for the solution, I finally got this issue sorted by altering my plugins.js file
OLD plugins.js

module.exports = ({ env }) => ({

    upload: {
        provider: 'cloudinary',
        providerOptions: {
            cloud_name: env('CLOUDINARY_NAME'),
            api_key: env('CLOUDINARY_KEY'),
            api_secret: env('CLOUDINARY_SECRET'),
          
        },
        actionOptions: {
            upload: {},
            delete: {},
        },
    },

});

NEW 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'),
          
        },
    },
},
});
2 Likes
6

when i use the above configuration i get these error message:

debug: :no_entry: Server wasn’t able to start properly.
[2022-01-09 17:30:04.239] error: provider.init is not a function

any help please?
Thanks

7

hello @landolsi, sometimes it can be a node version that is not compatible with strapi v4.
for my case, i used Node: 6.13.1

8

Hi @filipe256 cloudinary package new installed and it works now.

Thank you.

9

Hi @landolsi ,

I encounter the same problem as you with “error: provider.init is not a function” when updating the plugin.js file with “config: { … }”

I tried to reinstall the cloudinary package but it still doesn’t work.

What version of node do you currently use on your project ?

Thanks

10

Hi @NuncEstBibendum ,

I was encountering the same problem and I fixed it by adding cloudinary with the following npm install

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

previously I was using the following npm install

npm i strapi-provider-upload-cloudinary

and that was not working properly for me. Beyond that you need to update the plugins.js and the middleware.js file like mention in the npm documentation

2 Likes
11

Thanks a lot ! It finally works :smiley:

12

Thank you! :+1:

13

Thank you it worked for me!

15

The above solution did not work out for me. Which node version is best suitable for strapi v4

16

I finally got Cloudinary to work with Strapi V4. The instructions on https://www.npmjs.com/package/strapi-provider-upload-cloudinary are not working. Not only is the npm package not working and must be installed as such

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

but also the content of the plugin.js file is different than what is listed in the docs. It is as follows:

module.exports = ({ env }) => ({

upload: {
    config:{
    provider: 'cloudinary',
    providerOptions: {
        cloud_name: env('CLOUDINARY_NAME'),
        api_key: env('CLOUDINARY_KEY'),
        api_secret: env('CLOUDINARY_SECRET'),
      
    },
},

},
});

I just wrote a short blog post on how I got the strapi v4 and cloudinary integration to work. You can read it here.

Integrating Cloudinary with Strapi

17

With me, when i removed

`'market-assets.strapi.io`

it working

module. Exports = [
  "strapi::errors",
  {
    name: "strapi::security",
    config: {
      contentSecurityPolicy: {
        useDefaults: true,
        directives: {
          "connect-src": ["'self'", "https:"],
          "img-src": ["'self'", "data:", "blob:", "res.cloudinary.com"],
          "media-src": ["'self'", "data:", "blob:", "res.cloudinary.com"],
          upgradeInsecureRequests: null,
        },
      },
    },
  },
  "strapi::cors",
  "strapi::poweredBy",
  "strapi::logger",
  "strapi::query",
  "strapi::body",
  "strapi::session",
  "strapi::favicon",
  "strapi::public",
];
18

Nothing work for me, I have nodejs 16, strapi 4.11, @strapi/provider-upload-cloudinary 4.11, also removed ‘market-assets.strapi.io’ didn’t help either. Am I missing something?

1 Like
19

us bro us . did u get any solution

20

how I’ve tried everything but its still not working