vueは画像をローカルにダウンロードする(同源と異源の解決方法)

同源の直接aラベルのダウンロード

異なるソースのdownメソッドでダウンロード

    down() { //      
      this.downloadIamge(this.srcImg, 'pic')
    },
    downloadIamge (imgsrc, name) { //           
      var image = new Image()
      //      Canvas     
      image.setAttribute('crossOrigin', 'anonymous')
      image.onload = function () {
        var canvas = document.createElement('canvas')
        canvas.width = image.width
        canvas.height = image.height
        var context = canvas.getContext('2d')
        context.drawImage(image, 0, 0, image.width, image.height)
        var url = canvas.toDataURL('image/png') //      base64    
        var a = document.createElement('a') //     a  
        var event = new MouseEvent('click') //         
        a.download = name || 'photo' //       
        a.href = url //     URL   a.href  
        a.dispatchEvent(event) //   a     
      }
      image.src = imgsrc
    },