glsl - WebGL GLSL Shader：访问texture2D会覆盖其他纹理

Question

我对 WebGL 中的 glsl 有一个非常令人不安的问题。

此着色器按预期工作：

uniform sampler2D tColor;
uniform sampler2D tNormal;
varying vec2 vUv;

void main() {
    gl_FragColor = texture2D( tColor, vUv );
}

但是这个行为完全不同：

uniform sampler2D tColor;
uniform sampler2D tNormal;
varying vec2 vUv;

void main() {
    vec4 test = texture2D( tNormal, vUv );
    gl_FragColor = texture2D( tColor, vUv );
}

通过访问 tNormal 纹理，tColor 纹理被覆盖。这怎么可能？

Answer 1

过去我看到过类似的行为，这几乎总是因为我不正确地绑定我的纹理。最近的事件是在我尝试像这样绑定我的纹理时引起的：

gl.activeTexture(gl.TEXTURE0);
gl.bindTexture(gl.TEXTURE_2D, colorTexture);
gl.uniform1i(colorUniform, gl.TEXTURE0);

gl.activeTexture(gl.TEXTURE1);
gl.bindTexture(gl.TEXTURE_2D, normalTexture);
gl.uniform1i(normalUniform, gl.TEXTURE1);

当正确的语法实际上是：

gl.activeTexture(gl.TEXTURE0);
gl.bindTexture(gl.TEXTURE_2D, colorTexture);
gl.uniform1i(colorUniform, 0); // 0 to indicate texture unit 0!

gl.activeTexture(gl.TEXTURE1);
gl.bindTexture(gl.TEXTURE_2D, normalTexture);
gl.uniform1i(normalUniform, 1); // 1 to indicate texture unit 1!

这是一个相当常见的错误，不幸的是，WebGL 实际上并没有在第一个代码片段（WebGL 邮件列表中最近讨论的主题）上抛出错误，而且它似乎在有限的情况下工作，所以很容易错误地认为这是有效的代码。

我不知道这是否是您的具体问题，但这可能是我可以提供的最佳建议，无需进一步详细信息。