js canvas如何实现压缩图片?

需求是实现压缩上传。网上看了大多是canvas方法实现,于是仿照着写了个。但是似乎并没什么用。上传后下载下来图片依然很大。
代码如下

        html5Reader(file, item){

            const reader = new FileReader();
            let Img = new Image();
            let newImageData;
            Img.src =  window.URL.createObjectURL(file);
            Img.onload = (e) => {
                let canvas = document.createElement('canvas');
                let ctx = canvas.getContext('2d');                       
                canvas.width = Img.width;
                canvas.height = Img.height;
                ctx.drawImage(Img, 0, 0, canvas.width, canvas.height);
                newImageData = canvas.toDataURL('image/jpeg', 0.1);
                console.log(newImageData)                    
                this.$set(item, 'src', newImageData);
            };                


        },
阅读 1.7k
1 个回答

问题解决了。
需要把base64的图片再转为普通图片上传。

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题