Blob未附加到formData

问题描述

我正在编写一个函数,该函数接受一组文件,调整文件的大小并将其上传到云存储中。

我有一个小问题,文件被附加到我的表单数据中,事实证明它们没有...

在后端,我使用nodejsMulter来处理图像,并且multer.array('files')的结果始终为[]。

我尝试更改代码以在不调整大小的情况下上传图像,并且效果很好。 有什么建议吗?

这是我的功能

    async function addProject(){
        try {
            btn = "disabled";
            let replacedTags = [];
            allTags = allTags.split(',');
            let final_height = 640;
            let formdata = new FormData();

            for(let i = 0; i < allTags.length; i++) {
                let newTag = allTags[i].replace(' ','');
                if(newTag != "") replacedTags.push(newTag);
            }

            tags = replacedTags;

            //Resize images
            let raw_images = document.getElementById('project_images').files;

            for(let j = 0; j < raw_images.length; j++) {
                let reader = new FileReader();
                reader.readAsDataURL(raw_images[j]);
                reader.name = "reader_" +new Date().getTime();
                reader.size = raw_images[j].size;

                reader.onload = function(event){
                    let img = new Image();
                    img.src = event.target.result;
                    img.size = event.target.size;

                    img.onload = async function(el){
                        let canvas = document.createElement('canvas');
                        let scale = final_height / el.target.height;
                        canvas.width = el.target.width * scale;
                        canvas.height = final_height;

                        let ctx = canvas.getContext('2d');
                        ctx.drawImage(el.target,canvas.width,canvas.height);

                        //Here is the problem,the blob does not get appended to the form
                        canvas.toBlob((blob) => {
                            formdata.append('files',blob,`project_${new Date().getTime()}.jpg`);
                        },'image/jpeg',0.92);
                    }

                };
            }


            formdata.append('header',header);
            formdata.append('title',title);
            formdata.append('info',info);
            formdata.append('tags',tags);
            formdata.append('ages',ages);
            for (let value of formdata.values()) {
                console.log(value); 
            }

            let head = new Headers();
            head.append('Accept','application/json');

            let createProject = await fetch(`${ipaddress}/leader/project`,{
                method: 'POST',credentials: 'include',body: formdata,// headers: head
            });
            let newProject = await createProject;

        }
        catch(err) {
            console.log(err);
        }
    }

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)