根据图片的路径（绝对路径/相对路径都可以），生成base64的

最新推荐文章于 2020-10-29 17:19:59 发布

anda9128

最新推荐文章于 2020-10-29 17:19:59 发布

阅读量622

点赞数 1

文章标签： javascript java 后端 ViewUI

原文链接：http://www.cnblogs.com/LChenglong/p/7691172.html

版权

根据图片的路径（绝对路径/相对路径都可以），生成base64的

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>nick getBase64</title>
</head>
<body>
<div><img id="test" src="" alt=""/></div>
<script src="jquery.min.js"></script>
<script>
//  var imgSrc = "https://img.alicdn.com/bao/uploaded/TB1qimQIpXXXXXbXFXXSutbFXXX.jpg";
    var imgSrc = "pic.jpg";
//    var imgSrc = "img/1.jpg";
      function getBase64(img){//传入图片路径，返回base64
        function getBase64Image(img,width,height) {//width、height调用时传入具体像素值，控制大小 ,不传则默认图像大小
          var canvas = document.createElement("canvas");
          canvas.width = width ? width : img.width;
          canvas.height = height ? height : img.height;
 
          var ctx = canvas.getContext("2d");
          ctx.drawImage(img, 0, 0, canvas.width, canvas.height);
          var dataURL = canvas.toDataURL();
          return dataURL;
        }
        var image = new Image();
        image.crossOrigin = '';
        image.src = img;
        var deferred=$.Deferred();
        if(img){
          image.onload =function (){
            deferred.resolve(getBase64Image(image));//将base64传给done上传处理
          }
          return deferred.promise();//问题要让onload完成后再return sessionStorage['imgTest']
        }
      }
      getBase64(imgSrc)
        .then(function(base64){
          console.log(base64);
          $("#test").attr("src",base64)
        },function(err){
          console.log(err);
        });
</script>
</body>
</html>

转载于:https://www.cnblogs.com/LChenglong/p/7691172.html

anda9128

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
根据图片的路径（绝对路径/相对路径都可以），生成base64的

根据图片的路径（绝对路径/相对路径都可以），生成base64的<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>nick getBase64</title></head><body>...
复制链接

扫一扫