当前位置: 首页 > 工具软件 > Data Img > 使用案例 >

img图片转换base64,解决前端导出不能导出图片的E跨域问题

严玉泽
2023-12-01
getBase64Image: 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 dataURL = canvas.toDataURL("image/png");
   return dataURL
   // return dataURL.replace("data:image/png;base64,", "");
},
main: function main(imgUrl) {
   var that =this
   var img = document.createElement('img');
   img.src = imgUrl;  //此处自己替换本地图片的地址
   console.log('url',imgUrl)
   //设置图片跨域访问
   img.crossOrigin = 'anonymous',
   img.onload = function () {
      var dataImg = that.getBase64Image(img);
      var img1 = document.createElement('img');
      var imgInsert = document.getElementById('imgInsert') //结构中不要写img,直接appendChild插入
      img1.src = dataImg;
      // document.body.appendChild(img1);
      imgInsert.appendChild(img1);
      console.log(dataImg);//打印base64图片
   }
}

 

$.ajax({
                type: "get",
                url:config+ "/froms/renderAnswerFroms?token=" + token + "&fromsId=" + formId + "&caseId=" + caseId + "&eventId=" + eventId + "&caseType=" + caseType,
                async: false,
                success: function success(result) {
                   num = 1
                    if (result.status == 200) {
console.log(result)
                        _this.name = result.body.name;
                        _this.widgets = result.body.widgets;
//var imgUrl = result.body.widgets[_this.widgets.length - 2].answer.resourceUrl
var imgUrl = 'static/20200110-095017-43.png'
_this.main(imgUrl)
                    }
                }
            });
 类似资料: