最近写上传商品的页面，因为是第一次写，遇到了很多问题，有的弄明白了，但是有的还没有丝毫头绪，现在在这里做一个总结。

1.刚开始的时候，我是仿照写个人中心的时候上传图片的方式去写的，因为在上传商品的过程中，会有很多图片以及数组，所以我当时想的是既然都是文件上传，应当不会有什么大问题，便用了原先的格式，因为上传的信息太多，不便全部展示，这里只写了大致的样式：

    img = document.getElementById('oImg').src
    var file = document.getElementById('ipt');
    var myfile = document.getElementById('browse');
    var formData = new FormData()
    formData.append('multipartFile',file.files[0]);
    formData.append('myfile',myfile);
    axios({
        url: `这里我填的是路径`,
        data: formData,
        method: 'post'
    }).then((data) => {
        console.log(data)   
        // if(data.data.data.code==20000){
        //    alert("qqqqqqqq")
        // }
    }).catch((err) => {
        console.log(err)
    })

在node环境中，我是使用如下方式传的参数

axios.post(`url`,formData{headers:formData.getHeaders() }).then((data) => {
    console.log("success============")
    console.log(data.data)
    res.send({data: data.data})
}).catch((error) => {
    console.log(error.response);
    console.log(error.response.status);
    res.send(error)
})

此时，我是不论什么格式，全部塞到了formData里面，这次报的是405，后端返回的报错信息是我上传的格式有误，找了半天，在node环境里打印出来了我从js里传递过来的信息，因为我传的东西有点多，其中除了第一个文件，也是我第一个传到formdata里的数据，能通过req.files查到，其余的都在req.body里面，我虽然很纳闷，但是并没有想太多，直接获取然后再node环境里直接添加到了这里的formData中，试图通过这个传给后端，但是这次，仍然报错，检查格式之后，发现传过来的图片出了问题，原先的json格式在通过multipartFile传递到node环境里的时候变为了二进制，我明白了之后想着直接把图片的url转换为base64格式给传过来，再在node里转换为接送格式，但是传过来后被转换这一步给难住了，通过求助我明白了问题所在，并使用了如下代码来传递数组：

    for(let j = 0; j<browse.files.length; j++){
        console.log("files")
        console.log(browse.files[j])
        formData.append(`fileUpload`, browse.files[j])
    }

formData是可以多个文件放到一个名字里传的！我明白过来后十分兴奋，感觉自己里解决这个问题不远了，立马付出行动，把相关代码全转换然后传递到node环境里，但是这次，仍然报错了，这次报的错是Arrays are not supported.意思是不支持数组的格式，这样一来，商品的规格，不同类的图片，商品详情的图片数组，等等都传不了了，思索了一会之后，我使用了前面js给node传值的方法，把他们一个一个拿出来传进formData里，传进去之后我沾沾自喜，连忙开始测试，不出意外，又一次报错了，这次报的错是400，连续的报错令我心烦意乱，但是不得不沉下心来检查，瞅着电脑屏幕看了一天，仔仔细细的浏览每一行代码，还是认为我的代码没有错，不得已之下开始上网翻看博客，看看有没有类似的报错。最后在一篇博客里找到了近似的情况，博主给的回答是，因为是用的header传值，并且传的文件过大，最后产生了报错，不得已，我只能学习另一种传参方法。

第二次用的方法和第一次大差不差，同样是用formData去传递参数，只是这次把formData是通过data传的，解决了一些因为格式改动而产生的500，404之类的报错之后，继续开始了尝试，但是这次的报错竟然是400，提示某个值为空！！！我反复检查了两三遍，确定了那个参数有值，最后通过更改了报错的顺序发现，是所有的参数都没有传过去，无奈之下我查阅博客，反反复复更改了传递的时候的一些属性，甚至在axios里加各种不明白的从博客里看到的属性，试图成功发送信息，但是除了引起一连串的千奇百怪的报错，比如400，403，404，405，甚至415这种没有见过的报错之外，没有任何用处，不甘心的尝试了很长时间之后，我不得已接受命运，开始了另一种传参方案。

最后这一种，是从学长那里学来的直接在url里加参数的方法，通过${encodeURI()}来将参数转换为合适的格式，然后把各种参数加进去，我感觉没有毛病，可以传参，然后尝试了，然后就报错了。

不知道是什么情况，可能是传递失败了，可能是后端接受参数之后没有转换过来，反正这个接口，写了一周，换了三种传参方式，每天改了十几个报错，把一个bug改成另一个bug，最后还是没有成功，希望最后能成功吧