Question

我想将我的cloudinary库中的所有图像显示在我的反应应用中。我可以像这样直接调用函数吗？

showImages = () =>{
   cloudinary.v2.api.resources({
       cloud_name: CLOUDINARY_CLOUD_NAME,
       upload_preset: CLOUDINARY_UPLOAD_PRESET,
       api_key: CLOUDINARY_API_KEY,
       api_secret: CLOUDINARY_API_SECRET,
       type: 'upload'}, function(error, result){
       console.log("herrrrrrrrrreeeeeeeeeeeee",error,result);
   });

}

它给了我这个错误。

Failed to load https://api.cloudinary.com/v1_1/dashboardui/resources/image/upload?: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3000' is therefore not allowed access. The response had HTTP status code 404. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

Answer 1

目前，还没有一种方法可以在React中列出资源。您使用的方法特定于Cloudinary Node SDK。如果您的应用程序绑定了服务器，则可以使用资源方法列出图像。

Answer 2

完成从cloudinary提取图像的方法是标记图像，您需要转到媒体库，该库将显示所有照片并用关键字“ upload”标记照片，然后可以在GET axios请求中使用它。我能够成功拉出标记的图像。您需要一些CSS来对齐图像

%y

Answer 3

您不应该在浏览器中使用此代码的主要原因是，永远不要在客户端公开云的秘密。

因此，您应该考虑分离代码以从Cloudinary到服务器代码中检索资源。您可以使用express（例如）将这段代码的结果展示给客户。

Cloudinary API使使用Search端点检索资源成为可能，因此您可以根据各种条件来检索资源。

请参阅：https://cloudinary.com/documentation/search_api

在react app中列出所有上传的图像

3 个答案: