WebGL problème de création de shaders

Question

Je suis en train de faire une simple application dans WebGL et JavaScript, et quelques tutoriels tout je vide sanitaire trouvé sur Internet, je suis tombé sur un problème étrange, tout en créant des shaders de base. La fonction qui crée le programme de shaders ressemble à ceci:

this.CreateShaderProgram = function(vertexShader, fragmentShader) 
    { 
    var tmp = this.gl.createProgram(); 

    var tempVert = this.gl.createShader(this.gl.VERTEX_SHADER);  
    this.gl.shaderSource(tempVert, vertexShader); 
    this.gl.compileShader(tempVert); 
    if(!this.gl.getShaderParameter(tempVert, this.gl.COMPILE_STATUS)) { 
      this.Log("invalid shader : " + vertexShader); 
      return null; 
    }; 

    var tempFrag = this.gl.createShader(this.gl.FRAGMENT_SHADER); 
    this.gl.shaderSource(tempFrag, fragmentShader); 
    this.gl.compileShader(tempFrag);  
    if(!this.gl.getShaderParameter(tempFrag, this.gl.COMPILE_STATUS)) { 
      this.Log("invalid shader : " + fragmentShader); 
      return null; 
    }; 

    this.gl.attachShader(tmp, tempVert); 
    this.gl.attachShader(tmp, tempFrag); 

    return tmp; 
    } 

Et les 2 shaders ressemblent:

attribute vec3 aVertexPosition; 
    uniform mat4 uMVMatrix; 
    uniform mat4 uPMatrix; 
    void main(void) { 
     gl_Position = uPMatrix * uMVMatrix * vec4(aVertexPosition, 1.0); 
    } 
    -------------------------------------------- 

    #ifdef GL_ES precision highp float; 
    #endif 
    void main(void) { 
    gl_FragColor = vec4(1.0, 1.0, 1.0, 1.0); }; 

La chose étrange est que le premier Vertex Shader compile avec succès, mais pour le fragment shader il se bloque sur le "this.gl.compileShader (tempFrag);" ligne et je ne peux pas comprendre pourquoi.

Answer 1

cet extrait de votre code:

#ifdef GL_ES precision highp float; 
#endif 

devrait être sur des lignes distinctes:

#ifdef GL_ES 
precision highp float; 
#endif 

En effet, le langage d'ombrage utilise un préprocesseur, un peu comme le C Preprocessor. Les lignes commençant par # sont des directives de préprocesseur qui couvrent toute la ligne. Attendu que l'instruction precision ne l'est pas; c'est juste une déclaration normale dans GLSL. Les placer sur la même ligne perturbe le préprocesseur, car il considère l'instruction de précision comme faisant partie de sa directive.

conseils de Zecc à utiliser getShaderInfoLog est également une valeur inestimable pour le débogage de ce genre de problèmes.

Answer 2

Si vous ne savez pas pourquoi il ne compiler, puis changer votre code comme ceci:

this.gl.compileShader(tempFrag);  
if(!this.gl.getShaderParameter(tempFrag, this.gl.COMPILE_STATUS)) { 
     this.Log("invalid shader : " + this.gl.getShaderInfoLog(tempFrag)); 
     return null; 
}; 

Cela devrait vous donner plus d'informations sur ce qui ne va pas (peut-être l'utilisation de #ifdef)