分析跨域

src/main/comos/src/views/user/Share.vue

@@ -48,7 +48,7 @@
             <div class="wrapper">
                 <img :src="img" class="wrapper-img" v-if="img" alt="" />
                 <div class="wrapper-box" v-else ref="post" @click.stop>
-                    <img class="share2" src="../../assets/share2.jpg" alt="" />
+                    <img class="share2" :src="shareBg" alt="" />
                     <vue-qrcode :value="url" :options="{ width: 70, margin: 3 }" class="share-code"></vue-qrcode>
                     <div class="title">国内领先的泛文娱数字藏品集换平台</div>
                 </div>
@@ -77,9 +77,13 @@ export default {
     data() {
         return {
             show: false,
-            img: ''
+            img: '',
+            shareBg: ''
         };
     },
+    mounted() {
+        this.getImgBase64(require('../../assets/share2.jpg'), 'shareBg');
+    },
     methods: {
         share() {
             this.show = true;
@@ -103,6 +107,25 @@ export default {
                 this.$toast.clear();
                 this.img = canvas.toDataURL('image/png');
             });
+        },
+        getImgBase64(img2, key) {
+            let img = new Image();
+            img.crossOrigin = 'anonymous';
+            let _this = this;
+            img.onload = function () {
+                let src = _this.image2Base64(img);
+                _this[key] = src;
+            };
+            img.src = img2;
+        },
+        image2Base64(img) {
+            let canvas = document.createElement('canvas');
+            canvas.width = img.width;
+            canvas.height = img.height;
+            let ctx = canvas.getContext('2d');
+            ctx.drawImage(img, 0, 0, img.width, img.height);
+            let dataURL = canvas.toDataURL('image/png');
+            return dataURL;
         }
     }
 };