视频直播源码,html2canvas 前端保存页面为图片

发布时间 2023-06-16 14:14:52作者: 云豹科技-苏凌霄

视频直播源码,html2canvas 前端保存页面为图片

转换方法如下:

 


/**
* 将页面指定节点内容转为图片
* 1.拿到想要转换为图片的内容节点DOM;
* 2.转换,拿到转换后的canvas
* 3.转换为图片
*/
// 生成局部图片
GenerateImg() {
  let element = this.$refs.canvasImgObj;
  // console.warn(element);
  html2canvas(element[this.slideIndex], { // 我这里是一个swiper,要是一个页面的话直接element就行
    allowTaint: true,
    useCORS: true,
    tainttest: true, // 检测每张图片都已经加载完成
    logging: true,
    backgroundColor: `rgb(143,40,37)`, // 转换图片可能会有白色底色,你可根据你的页面或者PM要求设置一下背景色,不要的话就null
  }).then((canvas) => {
    //  转成图片,生成图片地址
    let imgUrl = canvas.toDataURL("image/jpeg");
    console.warn(imgUrl); 
  });

以上就是 视频直播源码,html2canvas 前端保存页面为图片,更多内容欢迎关注之后的文章