尝试将图像文件上传到 imgur 时出现错误的请求状态 400答案

【问题标题】：Bad request status 400 when trying to upload image file to imgur尝试将图像文件上传到 imgur 时出现错误的请求状态 400
【发布时间】：2021-02-11 04:12:47
【问题描述】：

我正在尝试从我的 React 应用上传图像文件。不断收到 400 错误，女巫我不明白为什么。这是我在 React 中的 TypeScript 函数代码：

   public setImage = (args: ChangeEvent<HTMLInputElement>) => {

        const image = args.target.files[0];
        let formData: FormData = new FormData();
        formData.append("profileImage", image, image.name);
        const requestOptions = {
            method: 'POST',
            headers: { 'Authorization': 'Client-ID //my client-id here//' },
            image: image
        };
        fetch('https://api.imgur.com/3/image', requestOptions)
            .then(response => response.json())
            .then(data => console.log(data));

    }

还有错误：

{
data: error: "No image data was sent to the upload api"
method: "POST"request: "/3/image"
__proto__: Objectstatus: 400
success: false
__proto__: Object
}

当我在附加后尝试控制我的 FormData 对象时，我可以看到一个空对象。感谢您的任何回答！

【问题讨论】：

标签： reactjs typescript api uploading imgur

【解决方案1】：

首先想到的是将图像对象也记录下来，看看那里是否有任何问题。

还请查看this 以验证您是否正确记录了您的 FormData 对象。

但是，如果这仍然不足以调试问题，我建议您尝试使用 curl 或 Fiddler 之类的东西滚动请求，因为您正在手动创建 POST 标头。因此，您不会发送可能导致 imgur api 跳过整个请求正文的 Content-Length 标头。

要获得内容长度，您可以执行以下操作：

    let content-length = JSON.stringify(formData).length;

那么简单：

const requestOptions = {
        method: 'POST',
        headers: { 'Authorization': 'Client-ID //my client-id here//', 'Content-Length': content-length },
        image: image
    };

希望这在某些方面有用。

【讨论】：