p5.js saveCanvas（）失敗，並在谷歌瀏覽器「網絡錯誤」，除非控制檯是開放

Question

我寫了一首歌p5.js小草圖，通過節約使用saveCanvas()方法畫布的快照完成。

當我打開控制檯時，情況完全如我所料（我提供的名稱的文件被保存到Downloads文件夾）發生。但是，如果我關閉了開發者控制檯，則會看到「下載，失敗 - 網絡錯誤」。

這個問題似乎只在Chrome中發生。我已經能夠使用Safari和Firefox在沒有控制檯的情況下成功運行草圖。

我已經在我的代碼中刪除了對console的任何引用（例如console.log()）。

Answer 1

這是Chrome的最大長度已知限制錨的href。

通常的workaround是請求一個Blob，然後創建一個blobURI而不是dataURI，或者將data-URI轉換爲Blob和blobURI。

但是由於您使用p5.js的方法，他們應該這樣做，所以對於真正的修復，您必須在其跟蹤器上使用post an issue。

有關解決方法，你仍然可以訪問自己的canvas元素，

var canvas = createCanvas(w, h); 
var canvasElt = canvas.elt; 

調用其toBlob()方法，然後用像FileSaver.js東西得到同樣的結果。