最近在做項目時遇到遇到這樣的問題酬凳。Chrome瀏覽器無法下載圖片互纯，顯示網絡錯誤。很是納悶迎变，網上也查了很多的資料發(fā)現中文的資料非常的少充尉，所以在這里總結下。

關于圖片下載不在贅述衣形，我給出的方法是利用canvas進行圖片下載驼侠。

$scope.doloadQrcode = function (qrcodeUrl, fileName) {

        var basePath //圖片base64地址
        var $img = new Image()
        $img.setAttribute('crossOrigin', 'anonymous')
        $img.src = qrcodeUrl
        $img.onload = function () {
          var canvas = document.createElement('canvas')
          canvas.width = $img.width
          canvas.height = $img.height
          var ctx = canvas.getContext("2d")
          ctx.drawImage($img, 0, 0)
          basePath = canvas.toDataURL()
          var blob = dataURItoBlob(basePath)
          downloadFile(fileName, blob)
        }
      }

      /**
       * 下載圖片
       *
       * @param {any} fileName
       * @param {any} content
       */
      function downloadFile(fileName, content) {
        var oA = document.createElement('a');
        oA.href = content;
        oA.download = fileName;
        var event = document.createEvent('MouseEvents');
        event.initMouseEvent('click', true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
        oA.dispatchEvent(event);
      }

函數doloadQrcode l接受兩個參數，一個是下載圖片的地址谆吴，一個是可以認為是文件名倒源。利用canvas進行轉換。drawImage中0,0是原點纪铺。canvas.toDataURL()轉換成base64格式相速。其實非jpg格式都往下都可以了。但是往往結果并不會如意鲜锚。因為一些瀏覽器的原理突诬，不能直接下載圖片苫拍。我們需要在這里進行base64轉化為blob流的格式。下面是轉化blob流的方法旺隙。

function dataURItoBlob(base64Data) {
    var byteString;
    if(base64Data.split(',')[0].indexOf('base64') >= 0)
        byteString = atob(base64Data.split(',')[1]);
    else
        byteString = unescape(base64Data.split(',')[1]);
    var mimeString = base64Data.split(',')[0].split(':')[1].split(';')[0];
    var ia = new Uint8Array(byteString.length);
    for(var i = 0; i < byteString.length; i++) {
        ia[i] = byteString.charCodeAt(i);
    }
    return new Blob([ia], {
        type: mimeString
    });
}

轉化后就可以直接使用了绒极。