如果顶点着色器中的条件导致Android 10浏览器上出现“没有缓冲区绑定到启用的属性”错误

Question

我遇到了一个奇怪的问题。我使用WebGL在浏览器中渲染地图。除Android 10浏览器外，该平台在所有平台上都可以使用。

[有一个着色器，用于在地图上绘制虚线。在Android 10浏览器上，当绘制虚线时，控制台中显示“ INVALID_OPERATION：drawElements：没有缓冲区绑定到启用的属性”错误。

我删除了顶点着色器中的两个if条件，并且没有错误显示（如下所示）。

但如果条件不导致错误，则为其他。

[有一个在线Web应用程序正在使用此地图（https://yongche.baidu.com）。在Android 10以外的平台上，所有内容均可正确显示。但是在Android 10上，由于此错误，将不会显示虚线或地图上的铁路。

有解决这个问题的想法吗？

Answer 1

我们只能猜测，

如果未使用属性，则可能会进行优化。通过删除条件，您可能不再使用texcoord_y。如果texcoord_y是一个属性，并且对其进行了优化，则可能会影响属性的位置。这表明代码使用属性位置的方式是错误的。

您必须始终使用gl.getAttribLocation查找属性位置，或者必须先分配它们，然后才能与gl.bindAttribLocation链接。

假设您有一个声明的着色器

attribute vec4 position;
attribute float texcoord_y;
...

position和texcoord_y的位置未定义。如果您猜测position处于位置1而texcoord_y处于位置0，那么运气可能会起作用（因为在另一台设备/驱动程序/浏览器上可能会有所不同），但是当texcoord_y优化后突然出现position处于位置时0您的代码将失败。

位置都是针对特定程序的<>，具体取决于每个程序。因此，仅因为着色器对A在位置0处具有position而在位置1处具有texcoord_y并不意味着它们在着色器对B上将是相同的。]您总是需要在链接每个程序之后查找它们，或者需要在链接之前绑定它们以确保它们是您想要的。

我不知道这是您的问题，但是该错误和您对着色器的编辑正是对我的建议。代码的某处未正确使用属性位置。注释掉条件后，该错误被隐藏。在注释中显示错误。您可能正在正确地查找或绑定位置，但也许在某个地方存在与设置属性有关的错字。例如，一行类似于

gl.vertexAttribPointer(positionLocation, 3, gl.FLOAT, false, 0, 0);

将其复制并粘贴到其他位置，并且positionLocation未更改为正确的变量。]​​>