Javascript HTML5画布drawImage，如何保留图像源大小

我正在使用HTML5画布获取base64编码的图像数据。但是，生成的base64编码字符串与使用外部软件对原始图像文件进行编码的字符串不同且更小

---

我怀疑画布上绘制的是页面上呈现的经过大小调整/压缩的图像数据，而不是原始源数据。是这样吗？我如何获得图像的原始字节？不以任何方式操纵原始字节是至关重要的。

要使其在不压缩的情况下显示，请更改画布本身的高度/宽度：

function getImageBase64Data(_id)
{   
    var c = document.createElement('CANVAS');
    var ctx = c.getContext("2d");
    var img = document.getElementById(_id);
    ctx.drawImage(img, 0, 0);
    var dataURL = c.toDataURL();
    return dataURL.replace(/^data:image\/(png|jpg);base64,/, "");
}

---

是的，在画布上绘制图像会改变其数据，但这里的主要问题是您没有设置画布的大小，默认为300*150px。首先设置

c.width=img.naturalWidth；c、 height=img.naturalHeight

所以您至少可以得到相同大小的图像。通过设置画布的大小，生成的图像具有正确的尺寸，但只渲染了图像的一小部分呃？你还在用

drawImage（img，0,0）

调用它？这是个愚蠢的错误。我只是在控制台中打印并复制了base64字符串，没有注意到IE截断了字符串。。。当console打印函数的返回值时，它甚至包含了括起来的引号，所以我不知道字符串被截断了。在chrome控制台中，我可以打印整个字符串！然后是裁剪，不是压缩。在大多数情况下，不带参数的

canvas.toDataURL（）

实际上会解压缩图像

var img = new Image(); // var img = document.getElementById(_id);
img.onload = function() {
    var c = document.createElement('canvas');
    c.width = img.width;
    c.height = img.height;
    // ... other stuff        
};