摄像头拍照图片上传之坑-我想参数是一个file对象该怎么办？

公司业务需要，需要在web端调用摄像头进行拍照，然后把照片上传到服务器，拍照功能搞定，但是上传的时候却遇到了一点小麻烦。摄像头拍照之后生成的照片是base64编码格式的文件，由于照片是根据url回显的，所以我需要转换成file格式的文件进行上传，自己头一次搞也是一头雾水，百度大多数都是通过base64->Blob->file这种方式进行转换。看了其他博主的博客，逻辑上说得通，是一个可行的方法，但是我在使用的时候Blob->file转换的却报错，无论怎样都转换不成file 格式的文件，大多数博主的写法都差不多。网上常用写法如下：

//1 进行拍照，生成base64格式的文件
    //拍照，base64/image/png
    this.drawImage=function (callback) {
        if(!self.isStop){
            self.ctx.drawImage(self.video,0,0,self.config.video.width,self.config.video.height);
            var base64URL = self.convas.toDataURL('image/'+self.config.imgType,self.config.quality);
            callback&&callback(base64URL);
        }
    }
//2 然后把base64格式的文件转换成Blob
        function createFile(urlData) {
            var arr = urlData.split(','),
                mime = arr[0].match(/:(.*?);/)[1],
                bstr = window.atob(arr[1]),
                n = bstr.length,
                u8arr = new Uint8Array(n);
            while (n--) {
                u8arr[n] = bstr.charCodeAt(n);
            }
            return new Blob([u8arr], { type: mime });
        }
//3 把Blob对象转换成file
let files = new window.File([this.blob], file.name, {type: file.type})

但是博主用的时候却不行，到了后端仍然是一个blob对象，可能是我的姿势不对？所以我看到一篇博客直接转换成file对象如下：

        function dataURLtoFile(dataurl, filename) {//将base64转换为文件
            var arr = dataurl.split(','), mime = arr[0].match(/:(.*?);/)[1],
                bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n);
            while(n--){
                u8arr[n] = bstr.charCodeAt(n);
            }
            return new File([u8arr], filename, {type:mime});
        }

问题完美解决！返回的对象就可以直接当参数后端通过MultipartFile接收了，并且到服务器查看是图片格式