Web 前端开发 让前端飞

通过canvas将图片转为BASE64格式

2017-11-16  本文已影响0人  孫仲谋
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 ext = img.src.substring(img.src.lastIndexOf(".")+1).toLowerCase();
    var dataURL = canvas.toDataURL("image/"+ext);
    return dataURL;
}

有时候后台需要接受的是base64的文件。我们可以在获取图片之后调用这个函数进行转换。
在项目里我用了elementui的上传文件功能。
比较坑的是他有一个必填的action,而我后端的接口没有专门存放图片的地方。
后来我就想了一个比较搞笑的方法找一个参数少的查询接口。放上去该拼参数拼参数,该设header设header就当是一个假的地址。
结果果然好使了。

上一篇 下一篇

猜你喜欢

热点阅读