当前位置: 首页 > 知识库问答 >
问题:

前端上传文件一直报错,后端显示读文件出问题,怎么解决?

鲜于子琪
2024-04-08

前端上传文件一直报错,后端显示读文件出问题,刚进函数在绑定参数的时候就出了问题返回了

明明都能打印出来但文件就是上传不上去,服务器会报错
400 {"msg": "multipart: NextPart: EOF",
"code": 40日,
"data": null}
400 {"msg": "multipart: NextPart: EOF","code": 400,
"data": null}

跟后端给的接口参数也是一样的

handleFileChange(event) {            this.upfile = event.target.files[0];        },        uploadCourseMaterial() {            if (!this.upfile) {                alert("请先选择文件");                return;            }            const  formData = new FormData();            formData.append('file', this.upfile);             formData.append('courseId', parseInt(this.courseId));             formData.append('parentId', parseInt(this.parentId));             formData.append('private', this.isPrivate.toString());             formData.append('folder', this.isFolder.toString());             formData.append('filePic', parseInt(this.filePicId));             formData.append('folderName', this.folderName);             console.log(formData.get('file'))            console.log(formData.get('courseId'))            console.log(formData.get('parentId'))            console.log(formData.get('private'))            console.log(formData.get('folder'))            console.log(formData.get('filePic'))            console.log(formData.get('folderName'))            const boundary = '----' + Math.random().toString(36).slice(2, 17);             axios.post('/api/course/uploadFile', formData,{                headers: {                    'Content-Type': `multipart/form-data; boundary=${boundary}`,                    Authorization: this.$store.state.teacher.teacherData.token,                }            })            .then(response => response.json())            .then(data => {                // 处理响应数据                console.log(data);                alert("上传成功!");                this.clear();            })            .catch(error => {                console.error('Error:', error);                alert("上传失败,请重试!");            });    },

共有1个答案

甄云
2024-04-08

移除 'Content-Type': multipart/form-data; boundary=${boundary}

 类似资料:
  • 前端文件: /src/app/api/compress/route.ts 后端文件:src/app/api/upload/route.ts 报错内容: 麻烦各位熟悉Next的大佬看一下 问题代码的GitHub地址:https://github.com/AnsonZnl/next-upload

  • VUE3项目中,文件夹名修改了大小写,就报错。 一开始组件是cleanData/form.vue,我重命名为CleanData/editForm.vue。引入组件时,还提示之前的form.vue,选择editForm.vue之后就报错(第二张图) 报错说仅大小写不同,重启项目也没用。为啥会这样呢? 我百度试了不写.vue也不行:

  • 问题描述 我想将前端获取到的文件通过POST请求作为请求体参数传给后端,但是传过去之后发现文件是个空对象{} 问题出现的环境背景及自己尝试过哪些方法 问过chatgpt和查阅的一些资料后我尝试将File对象转化为Blob对象然后再传给后端,结果发现还是空对象{};之后我又尝试通过FormData来作为POST请求体参数可还是无济于事 相关代码 以下是nodejs后端对路由的统一处理:

  • springboot接收前端上传到后端的文件时,在controller层内大多数使用的是MultipartFile进行接收的,当使用file进行接收时会报错 有大佬知道为啥不能用file接收文件吗?

  • 本文向大家介绍spring boot上传文件出错问题如何解决,包括了spring boot上传文件出错问题如何解决的使用技巧和注意事项,需要的朋友参考一下 这篇文章主要介绍了spring boot上传文件出错问题如何解决,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 有一段时间没有使用测试环境的测试服务器。 然后昨天想使用一下测试环境,进行过文件