图片上传-本地图片转base64+ie8支持+本地预览支持

最近项目由于flash同学没在了，图片上传只能前端重新做，后台希望用base64数据上传，复用之前接口

问题来了，

1.ie8 不支持canvas转base64

2.本地预览 base64数据，ie8仅能显示32k数据

3.本地图片如何显示预览

4.base64数据如何换算成文件大小

 

//ie转换方法canvas转base64
      function ieBase64(file){//file是input type="file" 对象dom
            var realPath, xmlHttp, xml_dom, tmpNode, imgData;
            realPath = file;//获取文件的真实本地路径.
            xmlHttp = new ActiveXObject("MSXML2.XMLHTTP");
            xmlHttp.open("POST",realPath, false);
            xmlHttp.send("");
            xml_dom = new ActiveXObject("MSXML2.DOMDocument");
            tmpNode = xml_dom.createElement("tmpNode");
            tmpNode.dataType = "bin.base64";
            tmpNode.nodeTypedValue = xmlHttp.responseBody;
            imgData = "data:image/"+ "bmp" +";base64," + tmpNode.text.replace(/\n/g,"");
            //计算文件大小
            var str=imgData.substring(22);
            var equalIndex= str.indexOf('=');
            if(str.indexOf('=')>0){
                str=str.substring(0, equalIndex);
            }
            var strLength=str.length;
            var fileLength=parseInt(strLength-(strLength/8)*2);
            if(fileLength > 5120000){//图片大于5M
              alert("图片不能大于5M");
              return;
            }
            callback(imgData);
            //return imgData;//渲染图片
        }

本地预览 base64数据，ie8仅能显示32k数据

本地图片如何显示预览 

var url; 
        if (navigator.userAgent.indexOf("MSIE")>=1) { // IE >6 imgFile 是input type="file" 对象dom
            url = imgFile.value; 
        }else{
          url = window.URL.createObjectURL(imgFile.files.item(0));
        }
        $("#pic2").attr("src",url);//ie8浏览器 base64仅显示32k数据，这里用本地地址显示。。。等ajax执行完成，这里被替换
      });

 

base64数据如何换算成文件大小

//计算文件大小
            var str=imgData.substring(22);
            var equalIndex= str.indexOf('=');
            if(str.indexOf('=')>0){
                str=str.substring(0, equalIndex);
            }
            var strLength=str.length;
            var fileLength=parseInt(strLength-(strLength/8)*2);
            if(fileLength > 5120000){//图片大于5M
              alert("图片不能大于5M");
              return;
            }

 代码下载：https://files.cnblogs.com/files/zhidong123/img-to-base64-ie8.rar