canvas download時顯示“網絡錯誤”

 在使用html2canvas截取頁面的時候發現圖片死活保存不到本地，chrome一直報“網絡錯誤”，百度、谷歌無果。

后來想想，html2canvas生成的也是canvas對象，所以按這個關鍵字找到了解決方法。

解決鏈接:https://stackoverflow.com/questions/37135417/download-canvas-as-png-in-fabric-js-giving-network-error

主要出現這個問題是canvas保存圖片到本地時各個瀏覽器像素的限制不同，所以將圖片數據轉換成Blob數據流下載下來就行了。

主要代碼如下：

//....前面省略      
dataURLtoBlob(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});
      },
      downloadCanvas(){
        var link = document.createElement("a");
        var imgData =canvas.toDataURL({format: 'png', multiplier: 4});
        var strDataURI = imgData.substr(22, imgData.length);
        var blob = this.dataURLtoBlob(imgData);
        var objurl = URL.createObjectURL(blob);

        link.download = this.cName+".png";

        link.href = objurl;

        link.click();
      }
//省略后面...