我有一个页面将文件上传到服务器。当前我将文件附加到FormData对象并直接在axios帖子中发送此FormData对象(fd)。由于我将此数据存储在数据库中,因此在通过axios.post发送文件之前,了解如何将该文件转换为blob数据。
FileUpload.vue
<template>
<div class="file">
<input type="file" @change="onFileChanged">
</div>
</template>
<script>
export default {
name: 'FileUpload',
data () {
return {
selectedFile : null
}
},
methods: {
onFileChanged (event) {
this.selectedFile = event.target.files[0];
this.$store.dispatch('uploadFile', this.selectedFile); // calls the uploadFile() function
}
}
}
</script>
我的uploadFile()函数
async function uploadFile(path, data) {
try {
var fd = new FormData()
fd.append('file', data)
let response = await axios.post(props.base_url + path, fd, { headers: { 'Content-Type': 'multipart/form-data' } })
if (response.status == 200) {
console.log('you have a response')
console.log(response.status)
}
return response.data
} catch (err) {
console.error(err)
}
}
因此,在传递给axios发布请求之前,如何将通过输入type =“ file”上传的文件转换为blob数据。请以我的代码为例。