html 读取本地文件后使用文件二进制流上传文件

Posted 2021-05-10

fileUpload(e) {
                const files = e.currentTarget.files;
                _.each(files, (file) => {
                    const reader = new FileReader();
                    reader.readAsDataURL(file);
                    reader.onload = (e) => {
                        let imgBlob = e.target.result;
                        const formData = new FormData();
                        formData.append('file', imgBlob);
                        $.ajax({
                            url: this.api.uploadUrl,
                            type: 'post',
                            data: formData,
                            contentType: false, // 注意这里应设为false
                            processData: false,
                            cache: false
                        }).then((r) => {
                            this.images.push(r);
                            this.updateImages();
                        });
                    };
                    reader.onabort = () => {
                        dialog.showToast('图片上传被中断，请重新选择');
                    };
                    reader.onerror = () => {
                        dialog.showToast('图片读取失败，请重新选择');
                    };
                })
            },

<input type="file" multiple name="files[]" @change="fileUpload($event)">