如何在 JavaScript 中获取图像的数据 URL 而无需重新下载？

在 JavaScript 中获取图像数据 URL

此问题寻求一种方法来检索已加载到图像的数据 URL使用 JavaScript 的网页，专门用于 Firefox 的 Greasemonkey 脚本。目的是获取图像的base64编码内容，而不会产生再次下载的开销。

解决方案：

1. 创建一个Canvas元素： 创建一个空的画布元素，其尺寸与要匹配的图像相匹配
2. 复制图像数据： 使用“drawImage”函数将图像数据复制到画布元素上。此步骤假设图像已完全加载。
3. 获取数据 URL： 利用“toDataURL”函数检索所需格式的数据 URL，可以是PNG 或 JPEG。提供的解决方案使用 RegExp 仅从数据 URL 中提取 base64 编码的内容。

注意：

a。此方法仅在图像与网页托管在同一域中时有效。
b.生成的图像是重新编码的版本，而不是原始文件的精确副本。
c.提供的 JavaScript 代码假定 Greasemonkey 环境。

以上是如何在 JavaScript 中获取图像的数据 URL 而无需重新下载？的详细内容。更多信息请关注PHP中文网其他相关文章！