canvas截图 base64ToFile

2018-06-15  本文已影响0人  羊羊羊0703

说明

1、前端处理图片就是用canvas来做一个截图压缩的操作,上传后台要file文件,所以需要处理一下

代码

getImageFile: function(base64Codes) {
    var formData = new FormData();   // 加了参数,safari会报错
    //convertBase64UrlToBlob函数是将base64编码转换为Blob
    formData.append("imageName",convertBase64UrlToBlob(base64Codes));  //append函数的第一个参数是后台获取数据的参数名,和html标签的input的name属性功能相同
                
    return formData.get("imageName");
    /**
     * 将以base64的图片url数据转换为Blob
     * @param urlData
     *            用url方式表示的base64图片数据
     */
    function convertBase64UrlToBlob(urlData){
        var bytes=window.atob(urlData.split(',')[1]);        //去掉url的头,并转换为byte
        //处理异常,将ascii码小于0的转换为大于0
        var ab = new ArrayBuffer(bytes.length);
        var ia = new Uint8Array(ab);
        for (var i = 0; i < bytes.length; i++) {
            ia[i] = bytes.charCodeAt(i);
        }
        return new Blob( [ab] , {type : 'image/png'});
    }
}
上一篇下一篇

猜你喜欢

热点阅读