如何从VueJs提交“multipart / form-data”

我在前端使用VueJs / axios，在nodejs使用简单的file upload工作。

到目前为止，所有的尝试都失败了。 虽然这可以在angular度1/2使用ng-upload和其他类似的插件100种方式实现。 但是VueJs似乎缺乏这个基本的function。 根据我的研究axios不支持“multipart / form-data”。 Ref https://github.com/mzabriskie/axios/issues/789 。

multer和其他nodejs库似乎可以从1/2的angular度无缝地使用“multipart / form-data”。 但是，相同的function不适用于VueJs。

除了axios支持“multipart / form-data”又名：WebKitFormBoundary吗？

非常感谢

Answer 1

我在VueJs中find了两个达到这个目的的方法。 可能还有更多。

选项1.使用Axios。 根据上面的Bert Evans的回答

 const formData = new FormData(); formData.append("file", _file); formData.append("id", 7878); axios.post("/api/uploadFile", formData) .then(function (result) { console.log(result); }, function (error) { console.log(error); }); 

Answer 2

你可以使用FormData ，这很容易。

让我给你看一个例子：

 // html <button ref="uploadBtn" @onChange="upload">Upload Files</button> // js methods: { upload () { let files = this.$refs.uploadBtn.files let formData = new FormData() // if you want to upload multiple files at once loop // through the array of files formData.append('attachment', files[0]) axios.post(url, formData).then(response => ...) } } 

这应该做的伎俩，你真的不需要第三方插件。