将html2canvas生成截图上传到服务器

// html2canvas(Dom元素)
html2canvas(this.$refs.project).then(canvas => {

        let base64 = canvas.toDataURL("image/png")         // 先转化为base64

        let bstr = atob(base64.split(',')[1]);    // atob是将base64编码解码,去掉data:image/png;base64,部分
          let n = bstr.length;
          let u8arr = new Uint8Array(n);

          while (n--) {
            u8arr[n] = bstr.charCodeAt(n);
          }

          let file2 = new File([u8arr], 'a.jpg', {type: 'image/jpg'})


          var formData = new FormData();
          formData.append("file", file2);

          _this.$axios.post( _this.$store.state.path + 'configplatform2-upload-manage/UploadController/uploadFile?uniqueid='+ _this.projectInfo.info.uniqueid,formData)
            .then((res) => {
              console.log(res)
            })
        });

截图跨域问题思路:

图片是一直跨域,截图时将图片转化为base64格式就没问题了

你可能感兴趣的:(vue,JS)