13

我最近开始在我正在开发的网站上使用 WebGL。它被用作增强功能,如果 WebGL 不受支持或出现错误,该站点将回退到画布渲染。

不幸的是,当 Google Chrome 中发生 WebGL 异常时,会出现错误消息栏。在用户与之交互之前,该栏不会消失。如果他们重新加载或导航到不同的页面,则该消息将在该站点下次尝试使用 WebGL 时重新出现。

对于我的网站,这意味着 WebGL 错误消息永远不会消失,因为每个页面都尝试使用 WebGL。一旦发生错误,Chrome 将不会在同一个站点上再次使用 WebGL,直到用户告诉它重新加载,因此连续错误消息实际上并不表示连续错误,只是连续尝试使用 WebGL。


一旦发生 WebGL 错误,只需运行以下命令即可在该站点上重现此对话框:

document.createElement('canvas').getContext('experimental-webgl');

这不会引发任何异常,并且我.onerror在 canvas 元素上的方法没有被调用。

我无法对此进行深入调查,因为我无法可靠地重现 WebGL 错误。(即使我可以在我的计算机上复制一个,它也可能无法在其他人上复制。)


对于依赖 WebGL 的站点,这种行为是合理的,但我的站点不这样,因此该消息只会分散用户的注意力和混淆。

有没有办法抑制这个错误信息?一旦发生错误,我不介意退回到禁用 WebGL 的忽略行为。

4

2 回答 2

7

如果您想忽略异常,那么以下内容就足够了。

canvas.addEventListener("webglcontextlost", function(e) { e.preventDefault(); Stopdrawing(); }, false); 

如果你想重试加载 webgl 上下文

canvas.addEventListener("webglcontextrestored", function (event) {initializeResources();  }, false);

编辑:

如果您想测试上下文是否得到正确处理,请在 webgl 上下文中使用 WEBGL_lose_context 扩展。

gl.getExtension("WEBGL_lose_context").loseContext()
gl.getExtension("WEBGL_lose_context").restoreContext()
于 2013-08-22T10:41:30.860 回答
2

我花了很长时间才解决这个问题 - 似乎老鼠!使用 Chrome 调整具有基于它的 3D 上下文的画布大小时出现错误。解决方案是通过侦听器捕获调整大小并在该点重新创建画布和上下文。希望有帮助。

于 2016-06-02T05:55:05.550 回答