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东西得到同样的结果。