在项目中，模板配置需要获取实时效果，来作为用户展示的封面图，采用页面生成图片的方法才生成图片。

  // 截图生成封面并保存
  function exportImg() {
    dispatch({ type: 'LOADING', loading: true })
    html2canvas(document.querySelector('#drag-body'), { // 转换为图片
      useCORS: true // 解决资源跨域问题
    }).then(canvas => {
      // imgUrl 是图片的 base64格式 代码 png 格式
      let imgUrl = canvas.toDataURL('image/png');
      const d = getUintArray(imgUrl);
      const formData = new FormData();
      formData.append('resourceType', 1);
      formData.append('published', 'N');
      formData.append('organization', '');
      formData.append('file', d, '封面.png');
      reqwest({
        // url: '/HwapiService/media/upload',
        url: '/PictureServer/uploadStaticResWithNoToken',        
        method: 'post',
        data: formData,
        processData: false,
        contentType: false,
        headers: {
          Authorization: get() ? `${get().tokenType} ${get().accessToken}` : null,
        },
        success: (res) => {
          if (res?.subCode === 0) {
            const imgUrl = res?.data?.imgUrl;
            saveAll(imgUrl);
          } else {
            dispatch({ type: 'LOADING', loading: false })
            message.error('封面图片获取失败');
          }
        },
        error: () => {
          dispatch({ type: 'LOADING', loading: false })
          message.error('封面图片获取失败');
        },
      });
    })
  }

  // base64转二进制传给接口
  function getUintArray(dataurl) {
    var arr = dataurl.split(','), mime = arr[0].match(/:(.*?);/)[1],
      bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n);
    while (n--) {
      u8arr[n] = bstr.charCodeAt(n);
    }
    return new Blob([u8arr], { type: mime });
  }