JS将图片url转换base64，解决阿里云oss跨域问题

最新推荐文章于 2024-06-04 17:17:44 发布

码峰99

最新推荐文章于 2024-06-04 17:17:44 发布

阅读量1.7k

点赞数 4

分类专栏：前端文章标签： javascript 阿里云前端

本文链接：https://blog.csdn.net/weixin_46669100/article/details/126988441

版权

前端专栏收录该内容

1 篇文章 0 订阅

订阅专栏

JS将图片url转换base64，解决阿里云oss跨域问题

一，js代码，传入图片url

function drawBase64Image (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/');
        return dataURL;
    }

二，js调用

var imgUrl = 'https://xxxxx/xxx.png';
let image = new Image();
image.src = imgUrl  + "?v=" + Math.random(); // 防止缓存，必填
image.crossOrigin = '*'; // 解决前端跨域问题
image.onload = function(){
	var base64 = drawBase64Image(image);
	console.log(base64);
}