我想在浏览器中调整上传图像的大小。我使用 canvas 将上传的图像绘制到画布上,然后调整其大小,并使用 toDataURL 方法的结果。
简化的代码(没有上传部分)看起来像这样:
var canvas = document.createElement('canvas');
var ctx = canvas.getContext('2d', { alpha: false} );
// img src contains data url of uploaded image
ctx.drawImage(img, 0, 0, imgWidth, imgHeight);
var dataUrl = canvas.toDataURL('image/png');
Run Code Online (Sandbox Code Playgroud)
问题是 dataUrl 包含 alpha 通道,尽管创建上下文时 alpha 设置为 false。
是否可以在没有 alpha 通道的情况下获取数据 url?
如果没有,我考虑使用 Javascript 图像库之一,但大多数都依赖于画布。
另外,我可以使用画布中的数据对图像进行编码,但我不想这样做:)