美文网首页
vue 截图,上传服务器

vue 截图,上传服务器

作者: 小虾57 | 来源:发表于2023-11-23 16:45 被阅读0次

    import html2canvas from 'html2canvas'

    //保存图片
    saveImg() {
    html2canvas(this.$refs.table, {
    useCORS: true,
    backgroundColor: null
    }).then(canvas => {
    const dataUrl = canvas.toDataURL('images/jpg')

               var aa =  this.base64ToFile(dataUrl,'test');
         
         })
     }, 
     // base64转file文件
     base64ToFile(base64, fileName) {
        var byteString = atob(base64.split(',')[1])
        var mimeString = base64.split(',')[0].split(':')[1].split(';')[0]
        var ab = new ArrayBuffer(byteString.length)
        var n = byteString.length;
        let u8arr = new Uint8Array(ab);
      
        while (n--) {
          u8arr[n] = byteString.charCodeAt(n);
        }
        return new File([u8arr], fileName, { type: mimeString });
      }, 
      // base64转buffer
      dataURItoBlob (dataURI) { 
        var byteString = atob(dataURI.split(',')[1])
        var mimeString = dataURI.split(',')[0].split(':')[1].split(';')[0]
        var ab = new ArrayBuffer(byteString.length)
        var ia = new Uint8Array(ab)
        for (var i = 0; i < byteString.length; i++) {
          ia[i] = byteString.charCodeAt(i)
        }
        return new Blob([ab], { type: mimeString })
      },

    相关文章

      网友评论

          本文标题:vue 截图,上传服务器

          本文链接:https://www.haomeiwen.com/subject/zldgwdtx.html