canvasContext.fillRect在Firefox中引发NS_ERROR_FAILURE异常 [英] canvasContext.fillRect throws NS_ERROR_FAILURE exception in Firefox

问题描述

我试图在页面顶部（某种灯箱背景）上绘制一个巨大的画布矩形，代码非常简单：

I'm trying to draw a huge canvas rectangle on top of the page (some kind of lightbox background), the code is quite straightforward:

var el = document.createElement('canvas');
el.style.position = 'absolute';
el.style.top  = 0;
el.style.left = 0;
el.style.zIndex = 1000;
el.width  = window.innerWidth + window.scrollMaxX;
el.height = window.innerHeight + window.scrollMaxY;

...
document.body.appendChild(el);

// and later

var ctx = el.getContext("2d");
ctx.fillStyle = "rgba(0, 0, 0, 0.4)";
ctx.fillRect(0, 0, el.width, el.height);

有时（并非总是）最后一行抛出：

And sometimes (not always) the last line throws:

组件返回的失败代码：0x80004005（NS_ERROR_FAILURE）[nsIDOMCanvasRenderingContext2D.fillRect]

Component returned failure code: 0x80004005 (NS_ERROR_FAILURE) [nsIDOMCanvasRenderingContext2D.fillRect]

I我一直在猜测这是由于图像大小还是由于画布下面的内容类型（例如，嵌入的视频播放）而发生的，但显然不是。

I've been guessing if that happens because of image size or because of the content type beneath the canvas (e.g. embeded video playing), but apparently not.

所以我正在寻找有关如何隔离和/或解决此问题的想法。

So I'm looking for any ideas on how to isolate and/or solve this issue.

推荐答案

查看 nsIDOMCanvasRenderingContext2D.fillRect（）实现（并执行其调用的功能）-不会有太多的情况会返回 NS_ERROR_FAILURE 。仅当 EnsureSurface（）或 mThebes-> CopyPath（）失败时才会发生。 EnsureSurface（）中的以下两行很可能是您问题的来源：

Looking at the nsIDOMCanvasRenderingContext2D.fillRect() implementation (and going through the functions it calls) - there aren't all too many conditions that will return NS_ERROR_FAILURE. It can only happen if either EnsureSurface() or mThebes->CopyPath() fail. And the following two lines in EnsureSurface() are most likely the source of your issue:

// Check that the dimensions are sane
if (gfxASurface::CheckSurfaceSize(gfxIntSize(mWidth, mHeight), 0xffff)) {

此处正在检查什么：

• 画布的宽度或高度都不能超过65535像素。


• 在Mac OS X上，高度不能超过32767像素（平台限制）。


• 画布数据的大小（宽度*高度* 4 ）不能超过2 GB。

• Neither the width nor the height of the canvas can exceed 65535 pixels.
• The height cannot exceed 32767 pixels on Mac OS X (platform limitation).
• The size of canvas data (width * height * 4) cannot exceed 2 GB.

如果违反了这些条件中的任何一个，则 EnsureSurface（）将返回 false 并因此产生您所看到的异常。请注意，以上是实施细节，可以随时更改，您不应依赖它们。但是它们可能会告诉您您的代码违反了哪些特定限制。

If any of these conditions is violated EnsureSurface() will return false and consequently produce the exception you've seen. Note that the above are implementation details that can change at any time, you shouldn't rely on them. But they might give you an idea which particular limit your code violates.

这篇关于canvasContext.fillRect在Firefox中引发NS_ERROR_FAILURE异常的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！