使用 axios 和 saga 将文件从 formik reactjs 发送到 springboot

Question

我可以从邮递员发送文件 "userPicture" 并在后端 (springboot) 中获取它并且我将它保存到我的数据库 mongodb 没有任何问题但是当我从表单发送图片时，我在 reactjs 和 axios 中使用 Formik 组件我显示我输入的 userPicture 的内容我得到

在 axios 中，我这样做是为了发送请求。对于边界，我不知道我从一个例子

复制过去 "WebKitFormBoundaryQ0pBuvRC1EzDAQWT" 是什么

  try {
        const { user } = action;
        console.log(user);
        const request = yield axios({
            method: 'post',
            url: ENDPOINTS.USER + '/add',
            data: user,
            headers: { 'Content-Type': 'multipart/form-data;boundary=----WebKitFormBoundaryQ0pBuvRC1EzDAQWT----' }
        });

在后端我得到这个错误

,org.springframework.validation.BindingResult,org.springframework.web.multipart.MultipartFile,org.springframework.web.multipart.MultipartFile) throws java.io.IOException: Required request part 'userPicture' is not present

当我发送没有 userPicture 参数的请求时，我在邮递员中遇到了同样的错误

Answer 1

您发送的文件似乎有误。如果要从客户端向服务器发送multipart/form-data，则需要使用FormData.

像这样

const formData = new FormData();
formData.append('usePicture', user)

使用 axios 和 saga 将文件从 formik reactjs 发送到 springboot

send file from formik reactjs to springboot using axios with saga

saga

reactjs

redux-saga

axios

formik