前端如何将图片传到后端原生js（nodejs后端保存代码请看我另一篇文章）

最近需求，需要上传用户头像，研究了两天，后端接口怎么写参考我另一篇文章。

现在后端接口写好了，需要前端来写传递图片

我直接用的原生js，没有用组件，我先讲一下原理，前端并不是直接传递文件流给后端的，而是我们提供一个地址，浏览器会帮我们传过去，上传的图片被保存到一个叫C:/faskpath/文件夹下

首先html部分

<button @click="sumimg">提交图片</button>
<input type="file" id="ones"/>

就两句话，一个选文件，一个按钮提交，记得给input一个id值

接下来js写按钮语句

async sumimg() {
       //拿到元素节点
      let ones=document.getElementById('ones')
      //读取到第一个照片图
      const file = ones.files[0]
        //声明一个对象，传递图片用
      let obj=new FormData()
        //追加到刚刚创建的对象里面
      obj.append('flies',file)
        //我这里axios封装了，你们也可以直接axios.post({})效果一样
      const { data: res } = await this.$http.post("uploadimg",obj
      );
    },

这样只要把照片传到后台，虽然后台接收到是一串不规则命名，后端将照片重新命名，就保存到了后端，不需要再传递照片名，后端接收到req.files上面有这个图片原来的名字。