Question

我有一个上传文件的输入，我想将文件保存在服务器中。我使用邮递员，一切正常，但在代码中情况变得混乱。我每次点击按钮都会收到此错误

“ {” httpStatus“：”内部服务器错误“，” httpStatusCode“：500，” status“：” ERROR“，”消息“：”当前请求不是多部分请求“}”

我的代码：

const handleFile= (data) => {
    setFile(data.target.files[0]);
    
  };


  const sendJson = () => {
        formdata.append("file", file);

           const requestImage = {
             method: "POST",
             headers: myHeaders,
             body: formdata,
           };

           fetch(urlFiles, requestImage)
             .then((response) => response.text())
             .then((result) => console.log(result))
             .catch((error) => console.log("error", error));
           }
return ( 
      <input
          style={{ display: "none" }}
          id="upload-photo"
          name="upload-photo"
          type="file"
          onChange={handleFile}
          inputRef={register}
        />
            <Button
                variant="contained"
                color="primary"
                typeof={"submit"}
                onClick={(() => sendJson())}
                >
                Registar
              </Button>
)

此错误是什么意思，我该如何解决？我尝试了一些解决方案，例如在form标签中添加enctype =“ multipart / form-data”，但没有任何效果。请帮助我

Answer 1

使用fetch进行多部分请求的标准方法如下，


const formData = new FormData();
formData.append('myFile', fileInput.files[0]);

fetch(url, {
  method: 'POST',
  body: formData
}).then(res => response.json()).then(console.log).catch(console.error);

请勿设置Content-Type标头。浏览器将为您设置它以及一些称为“处置”的东西。要了解多部分表单，我在上面写了一个博客。 https://dev.to/sidthesloth92/understanding-html-form-encoding-url-encoded-and-multipart-forms-3lpa

如何解决“多方请求”错误？

1 个答案: