上传文件 Vue 3 和 Django REST

Question

如果我正确处理请求，我不明白，上传所有文件后都是 1 KB，我无法打开它们。如何创建正确的文件？如果我将文件另存为 .doc，我可以看到：

 ------WebKitFormBoundaryt3UjlK5SVq8hgppA
Content-Disposition: form-data; name="file"

[object FileList]
------WebKitFormBoundaryt3UjlK5SVq8hgppA--

所以我的函数要在 js 文件中提交：

async submitFiles() {

            let formData = new FormData();
            formData.append('file', this.file);
            console.log(this.file)

            axios.put(`/api/v1/myapp/upload/${this.file[0].name}`,
                formData,
                {
                    headers: {
                        'Content-Disposition': 'attachment',
                        'X-CSRFToken': await this.getCsrfToken(),
                    },

                }
            ).then(function () {
                console.log('SUCCESS!!');
            })
            .catch(function () {
                console.log('FAILURE!!');
            });

        },

处理表单文件的变化

        fileChanged(file) {
            this.file = file.target.files
        },

最后是我的 view.py

class FileUploadView(APIView):
    parser_classes = [FileUploadParser]

    def put(self, request, filename, format=None):

        file_obj = request.data['file']

        handle_uploaded_file(file_obj)
        return Response({'received data': request.data})

在哪里

def handle_uploaded_file(f):
    with open('path/to/my/folder/' + str(f.name), 'wb+') as destination:
        for chunk in f.chunks():
            destination.write(chunk)

Answer 1

[object FileList]

哦，你序列化了整个FileList。

更改为：formData.append('file', this.file[0]);

如果这不起作用，您可能需要阅读文件的内容。

编辑：应该足够了，根据 MDN：

字段的值。这可以是 USVString 或 Blob（包括 File 等子类）。如果没有指定这些值，则将值转换为字符串。