feat: html2canvas生成缩略图时禁止遍历模板封面图

app/web/page/editor/component/BasicPageFormModal/index.ts

@@ -119,7 +119,12 @@ export default class DynamicForm extends Vue {
       const imgName = btoa(`coverImage-${uuidv4().substr(0, 8)}`);
       const gridEle = document.querySelector('.Dcm-container-panel');
       this.changeStyle('forward');
-      const canvas = await html2canvas(gridEle as HTMLElement, { useCORS: true, allowTaint: true });
+      const canvas = await html2canvas(gridEle as HTMLElement, { useCORS: true, allowTaint: true, ignoreElements: (element: any) => {
+        if (element.className.toLowerCase() == 'ignore-html2canvas-loop') {
+          return element;
+        }
+        return false;
+      } });
       this.changeStyle('backward');
       const base64 = canvas.toDataURL();
       const { data: { uptoken } } = await editorApi.getUpToken();

app/web/page/editor/component/DynamicComponent/index.vue

@@ -9,6 +9,7 @@
 				            <p slot="title">{{ config.title }}</p>
 				            <div class="dynamic-row-card">
 					            <img
+												class="ignore-html2canvas-loop"
 											  :src="config.coverImage || 'http://activitystatic.q-gp.com/low_code.jpg'"
 											/>
 				            </div>
@@ -26,6 +27,7 @@
 		            <p slot="title">{{ config.title }}</p>
 		            <div class="dynamic-row-card">
 			            <img
+										class="ignore-html2canvas-loop"
 									  :src="config.coverImage || 'http://activitystatic.q-gp.com/low_code.jpg'"
 									/>
 		            </div>

package-lock.json

@@ -4837,9 +4837,9 @@
       }
     },
     "base64-arraybuffer": {
-      "version": "0.2.0",
-      "resolved": "http://npmprivate.quantgroups.com/base64-arraybuffer/-/base64-arraybuffer-0.2.0.tgz",
-      "integrity": "sha512-7emyCsu1/xiBXgQZrscw/8KPRT44I4Yq9Pe6EGs3aPRTsWuggML1/1DTuZUuIaJPIm1FTDUVXl4x/yW8s0kQDQ=="
+      "version": "1.0.2",
+      "resolved": "http://npmprivate.quantgroups.com/base64-arraybuffer/-/base64-arraybuffer-1.0.2.tgz",
+      "integrity": "sha512-I3yl4r9QB5ZRY3XuJVEPfc2XhZO6YweFPI+UovAzn+8/hb3oJ6lnysaFcjVpkCPfVWFUDvoZ8kmVDP7WyRtYtQ=="
     },
     "base64-js": {
       "version": "1.5.1",
@@ -7368,11 +7368,11 @@
       }
     },
     "css-line-break": {
-      "version": "1.1.1",
-      "resolved": "http://npmprivate.quantgroups.com/css-line-break/-/css-line-break-1.1.1.tgz",
-      "integrity": "sha512-1feNVaM4Fyzdj4mKPIQNL2n70MmuYzAXZ1aytlROFX1JsOo070OsugwGjj7nl6jnDJWHDM8zRZswkmeYVWZJQA==",
+      "version": "2.1.0",
+      "resolved": "http://npmprivate.quantgroups.com/css-line-break/-/css-line-break-2.1.0.tgz",
+      "integrity": "sha512-FHcKFCZcAha3LwfVBhCQbW2nCNbkZXn7KVUJcsT5/P8YmfsVja0FMPJr0B903j/E69HUphKiV9iQArX8SDYA4w==",
       "requires": {
-        "base64-arraybuffer": "^0.2.0"
+        "utrie": "^1.0.2"
       }
     },
     "css-loader": {
@@ -12535,11 +12535,12 @@
       }
     },
     "html2canvas": {
-      "version": "1.0.0-rc.7",
-      "resolved": "http://npmprivate.quantgroups.com/html2canvas/-/html2canvas-1.0.0-rc.7.tgz",
-      "integrity": "sha512-yvPNZGejB2KOyKleZspjK/NruXVQuowu8NnV2HYG7gW7ytzl+umffbtUI62v2dCHQLDdsK6HIDtyJZ0W3neerA==",
+      "version": "1.4.1",
+      "resolved": "http://npmprivate.quantgroups.com/html2canvas/-/html2canvas-1.4.1.tgz",
+      "integrity": "sha512-fPU6BHNpsyIhr8yyMpTLLxAbkaK8ArIBcmZIRiBLiDhjeqvXolaEmDGmELFuX9I4xDcaKKcJl+TKZLqruBbmWA==",
       "requires": {
-        "css-line-break": "1.1.1"
+        "css-line-break": "^2.1.0",
+        "text-segmentation": "^1.0.3"
       }
     },
     "htmlparser2": {
@@ -23924,6 +23925,14 @@
       "integrity": "sha512-wiBrwC1EhBelW12Zy26JeOUkQ5mRu+5o8rpsJk5+2t+Y5vE7e842qtZDQ2g1NpX/29HdyFeJ4nSIhI47ENSxlQ==",
       "dev": true
     },
+    "text-segmentation": {
+      "version": "1.0.3",
+      "resolved": "http://npmprivate.quantgroups.com/text-segmentation/-/text-segmentation-1.0.3.tgz",
+      "integrity": "sha512-iOiPUo/BGnZ6+54OsWxZidGCsdU8YbE4PSpdPinp7DeMtUJNJBoJ/ouUSTJjHkh1KntHaltHl/gDs2FC4i5+Nw==",
+      "requires": {
+        "utrie": "^1.0.2"
+      }
+    },
     "text-table": {
       "version": "0.2.0",
       "resolved": "http://npmprivate.quantgroups.com/text-table/-/text-table-0.2.0.tgz",
@@ -24795,6 +24804,14 @@
       "resolved": "http://npmprivate.quantgroups.com/utils-merge/-/utils-merge-1.0.1.tgz",
       "integrity": "sha1-n5VxD1CiZ5R7LMwSR0HBAoQn5xM="
     },
+    "utrie": {
+      "version": "1.0.2",
+      "resolved": "http://npmprivate.quantgroups.com/utrie/-/utrie-1.0.2.tgz",
+      "integrity": "sha512-1MLa5ouZiOmQzUbjbu9VmjLzn1QLXBhwpUa7kdLUQK+KQ5KA9I1vk5U4YHe/X2Ch7PYnJfWuWT+VbuxbGwljhw==",
+      "requires": {
+        "base64-arraybuffer": "^1.0.2"
+      }
+    },
     "uuid": {
       "version": "3.4.0",
       "resolved": "http://npmprivate.quantgroups.com/uuid/-/uuid-3.4.0.tgz",

package.json

@@ -50,7 +50,7 @@
     "egg-webpack": "^4.4.7",
     "egg-webpack-vue": "^2.0.0",
     "extend": "~3.0.0",
-    "html2canvas": "^1.0.0-rc.7",
+    "html2canvas": "1.4.1",
     "iview": "^2.9.0",
     "js-cookie": "^2.2.1",
     "less": "^3.12.2",