根据图片的路径(绝对路径/相对路径都可以),生成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>

 

相关文章:

  • 2022-12-23
  • 2022-12-23
  • 2021-12-07
  • 2022-01-09
  • 2022-02-03
  • 2021-11-22
猜你喜欢
  • 2022-12-23
  • 2022-12-23
  • 2021-05-19
  • 2021-09-23
  • 2022-12-23
  • 2021-12-07
  • 2022-01-03
相关资源
相似解决方案