美文网首页
img标签,获取图片的base64编码

img标签,获取图片的base64编码

作者: zhulichao | 来源:发表于2020-07-24 09:05 被阅读0次
```
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <script type="text/javascript">
        function getBase64Image(img) {
            var canvas = document.createElement("canvas");
            canvas.width = img.width;
            canvas.height = img.height;
            var ctx = canvas.getContext("2d");
            ctx.drawImage(img, 0, 0, img.width, img.height);
            var dataURL = canvas.toDataURL("image/png");
            return dataURL;
        }

        function main() {
            var img = document.createElement('img');
            // 注意这个图片需要是同源的
            img.src = './1.png';
            img.onload =function() {
                var data = getBase64Image(img);
                console.log("图片的base64编码:", data);
            }
            document.body.appendChild(img);
        }

        main()
  </script>
</body>
</html>
```

相关文章

网友评论

      本文标题:img标签,获取图片的base64编码

      本文链接:https://www.haomeiwen.com/subject/igfjhktx.html