Javascript 从React:am上传Cloudinary图像，包括Cloudinary未签名预设，但获取；使用“未签名上载”时必须指定上载预设；

我正试图基于这个codepen示例构建一个简单的Cloudinary图像上载：——

我已经将其转换为使用

fetch

，但即使我已转到Cloudinary设置并创建了一个未签名的上载预设，我将其提供给标题，我仍然会收到一个错误

POSThttps://api.cloudinary.com/v1_1/myproject/upload 400（错误请求）

显示错误消息

使用未签名上载时必须指定上载预设

我使用的代码如下

_callCloudinaryApi(file, method = 'post') {

    const config = {
      method
    }

    const cloudName = "myproject" // fictional project name here
    const unsignedUploadPreset = "mypreset" // fictional preset name here
    const url = `https://api.cloudinary.com/v1_1/${cloudName}/upload`;


    const fd = new FormData();
    fd.append('upload_preset', unsignedUploadPreset);
    fd.append('tags', 'browser_upload'); // Optional - add tag for image admin in Cloudinary
    fd.append('file', file);


    if (method !== 'get') {
      config.headers = {}
      config.headers['X-Requested-With'] = 'XMLHttpRequest'
    }

    return fetch(url, config)
      .then(res => res.json())
      .then(res => {
       console.log(res)
        return res;
      })
  }

---

有人能帮我确定问题出在哪里吗？非常感谢

您可以尝试以下方法-

    var data = new FormData();
    data.append('upload_preset', '<upload_preset>');
    data.append('file', file);
    data.append('cloud_name', '<cloud_name>');

    const config = {
        method: "POST",
        body: data 
    };

   var imgurl = "https://api.cloudinary.com/v1_1/<cloud_name>/image/upload";

   fetch(imgurl, config)
    .then(responseData => {
              console.log(JSON.stringify(responseData, null, 4));
    })

var data=new FormData（）；
data.append（'upload_preset'，''）；
data.append（'file'，file）；
data.append（'cloud\u name'，''）；
常量配置={
方法：“张贴”，
正文：数据
};
变量imgurl=”https://api.cloudinary.com/v1_1//image/upload";
获取（imgurl，config）
.然后（响应数据=>{
log（JSON.stringify（responseData，null，4））；
})

我也有这个错误，去

https://cloudinary.com/console/settings/upload

，您确实有一个

上传预设

，请确保其中有一个

签名模式

变为

未签名

就安全性而言，这可能不是最好的办法（我想更好的办法是获得认证）

---

顺便说一句，我在Devtools网络选项卡上找到了400错误的线索。

我遇到了同样的问题，希望这个解决方案能帮助其他人

uploadFile = async (e) => {
    const files = e.target.files;
    const data = new FormData();
    data.append('file', files[0]);
    data.append('upload_preset', 'PRESET_NAME');
    const res = await fetch('https://api.cloudinary.com/v1_1/{YOUR_ACOUNT_USER}/image/upload', {
      method: 'POST',
      body: data
    });
    const file = await res.json();
    console.log(file);
    this.setState({
      image: file.secure_url
    })
  }

---

谢谢，但这也不起作用——仍然得到相同的

400

错误。我甚至创建了一个新的预设，但没有骰子。我已转到我的Cloudinary设置，启用了

未签名上传

，并使用了

未签名

预设。我尝试了一个在线示例，其中您输入了预设，但它也不起作用。在你可以上传之前是否有一段等待时间？我今天创建了这个帐户。