使用 axios 直接将图片上传到 cloudinary

Posted 2023-03-25

【中文标题】使用 axios 直接将图片上传到 cloudinary

【英文标题】：Direct image upload to cloudinary using axios

【发布时间】：2019-02-14 14:15:29

【问题描述】：

我遇到了一个奇怪的问题，上传函数返回 400 错误，而在另一个组件中使用相同的代码，它就像一个魅力

handleSubmit = (e) => 
        e.preventDefault()
        var url = "https://api.cloudinary.com/v1_1/my_image_server/image/upload";
        const formData = new FormData();
        formData.append("file", this.state.img);
        formData.append("upload_preset", "the_correct_preset"); 
        formData.append("api_key", "the_correct_key");
        formData.append("timestamp", (Date.now() / 1000) | 0);
        return axios.post(url, formData, 
            headers: 
                "X-Requested-With": "XMLHttpRequest"
            
        )
        .catch(err => console.log("There has been ERROR: " + err))

正如我上面提到的，这是在另一个完美运行的组件中的完全相同的复制和粘贴代码。各位大侠能帮帮我吗，先谢谢了！

【问题讨论】：

您好，您是否检查了您提供给请求正文的每个值？例如this.state.img 的值。

天哪，这是问题所在，我太粗心了，非常感谢！

老兄，你拯救了我的一天，我不敢相信我已经花了好几天的时间敲打我的头而不考虑这个！您应该写下答案并获得一些堆栈积分，这是您应得的！

嗯，很高兴它对您有所帮助，我将把它放在答案中谢谢;)

【参考方案1】：

当请求的语法不符合预期时会发生 400。

您是否检查了您提供给请求正文的每个值？例如this.state.img 的值。