Javascript 无头浏览器在不丢失图像质量的情况下获取图像的数据URI

我正试图用无头Chrome浏览器在本地保存验证码，不想截图，也不想丢失验证码的质量

我想到的方法是将图像转换为数据URI，然后将其写入文件

我尝试了下面的代码，它确实有效，并为我保存了一个图像。问题是，我得到的验证码没有我刚刚下载或截图的验证码好

captcha\u img\u element=browser.通过xpath（“span[text（）='some text']//img”）查找元素
img_base64=浏览器。执行脚本（“”）
var ele=参数[0]；
var cnv=document.createElement（'canvas'）；
cnv.width=ele.width；cnv.height=ele.height；
cnv.getContext（'2d'）.drawImage（ele，0，0）；
返回cnv.toDataURL（'image/jpeg'）.substring（22）；
“”，captcha\u img\u元素）
将open（“captcha_js.png”，“wb”）作为f：
f、 写入（base64.b64解码（img_base64））

高质量的：

我通过js代码得到的：

它们看起来一样，但放大时，像素不同

---

那么，如何获取第一个（高质量）的数据URI，或者是否有其他方法不使用数据URI（在无头浏览器模式下）

使用

ele.intrinsicWidth

和

ele.intrinsicHeight

。这给出了图像的实际宽度和高度，而不是DOM元素的宽度/高度。

我将

ele.width

替换为

ele.intrinsicWidth

，

ele.height

替换为

ele.intrinsicHeight

，它没有为我保存图像。相反，我尝试了

ele.naturalWidth

，它保存了图像，但质量与使用

ele.width