vue.js2.0 + axios +formData 上传图片获取不到formData数据,始终为空

明天你好
  • 30

做一个简单的图片上传功能,用基础的input file类型来进行上传图片,后台始终获取不到数据,我前台有打印出来一些数据,但是formData对象的值始终为空,代码如下:

clipboard.png

        onUpload(e){
            let self = this;
            let file = e.target.files[0];
            let param =  new FormData();
            console.log(param);//FormData {}
            param.append('file',e.target.files[0]);
            console.log(param);//FormData {}
            param.append('chunk','0');
            console.log(param.get('file'));//file对象
            let config = {
                headers:{'Content-Type':'multipart/form-data'}
            }
            console.log(param);//FormData {}
            axios.post('/api/editreturn/',param,config).then(function(response){
                console.log(response);
            }).catch(function(err){
                console.log(err)
            })
          
        },

下面是依次打印出来的数据,最后一个是后台返回的数据

clipboard.png

下面是传递到后台的请求头内容

clipboard.png

求教:为什么formData的值总是为空?这样写图片上传的功能不对吗?

回复
阅读 12.7k
6 个回答

formData查看请用,formData.getAll("file")和formData.get("file"),直接看是看不到的,
axios有错,应该传param,而不是param.get('file')

上传可参考我的博客链接描述

直接传这个formData就行了,
然后你在chrome的控制台的network里面就可以看到你到底传没传值过去
图片描述

axios.post('/api/editreturn/',param,config)

Benson
  • 1
新手上路,请多包涵

我也遇到一样的问题了,请问楼主解决了没

西岭_夏
  • 1
新手上路,请多包涵

楼主问题解决了吗 分享一下解决方案

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
宣传栏