Emscripten OpenGL (3) 给出版本错误

Question

OS X - 铬。

我是 OpenGL / emscripten 的新手，并试图设置一个使用 WebGL 2、OpenGL 3+ 并通过 emscripten 构建到 webassembly 的简单脚本。

编译 WebGL 1 / OpenGL 2 没有问题。并将画布设置为 WebGL 2 / OpenGL 3 似乎也有效。当我检查正在运行的当前版本时，它会通知我关于 OpenGL 3.0 和 WebGL2（但也许它没有使用它......？）。

但是，emcc 仍然尖叫着关于着色器的错误，我给出的着色器仅与 3.0+ 版本兼容，从而暗示我正在运行 openGL 1/2 ？

通过 emscripten 设置新的上下文

EmscriptenWebGLContextAttributes ctxAttrs;
emscripten_webgl_init_context_attributes(&ctxAttrs);
ctxAttrs.alpha = GL_TRUE;
ctxAttrs.depth = GL_TRUE;
ctxAttrs.stencil = GL_TRUE;
ctxAttrs.antialias = 4;
ctxAttrs.premultipliedAlpha = false;
ctxAttrs.preserveDrawingBuffer = false;
ctxAttrs.minorVersion = 0;
ctxAttrs.majorVersion = 2; // WebGL2

this->context = emscripten_webgl_create_context(0, &ctxAttrs);
assert(this->context > 0); // Must have received a valid context.
int res = emscripten_webgl_make_context_current(this->context);
assert(res == EMSCRIPTEN_RESULT_SUCCESS);
assert(emscripten_webgl_get_current_context() == this->context);

着色器：

const char *vertexShaderSource = "#version 300 core\n"
        "layout (location = 0) in vec3 aPos;\n"
        "void main()\n"
        "{\n"
        "   gl_Position = vec4(aPos.x, aPos.y, aPos.z, 1.0);\n"
        "}\0";

const char *fragmentShaderSource = "#version 300 core\n"
        "out vec4 FragColor;\n"
        "void main()\n"
        "{\n"
        "   FragColor = vec4(1.0f, 0.5f, 0.2f, 1.0f);\n"
        "}\n\0";

当我在创建上下文后立即记录当前 OpenGL 版本时，

printf("OpenGL version supported by this platform : %s\n", glGetString(GL_VERSION));

我明白了：

此平台支持的 OpenGL 版本OpenGL ES 3.0 (WebGL 2.0 (OpenGL ES 3.0 Chromium))

Chrome 控制台说这个

ERROR::SHADER::VERTEX::COMPILATION_FAILEDERROR: 0:1: 'core' : invalid version directive
00:53:19.828 index.js:1 ERROR: 0:2: 'layout' : syntax error
00:53:19.829 index.js:1
00:53:19.830 index.js:1 ERROR::SHADER::FRAGMENT::COMPILATION_FAILEDERROR: 0:1: 'core' : invalid version directive
00:53:19.831 index.js:1 ERROR: 0:2: 'out' : storage qualifier supported in GLSL ES 3.00 and above only
00:53:19.832 index.js:1 ERROR: 0:2: '' : No precision specified for (float)
00:53:19.833 index.js:1 ERROR: 0:5: '1.0f' : Floating-point suffix unsupported prior to GLSL ES 3.00
00:53:19.834 index.js:1 ERROR: 0:5: '1.0f' : syntax error
00:53:19.835 

我像这样调用 emscripten，启用 FULL_ES3 和 WEBGL2。

emcc src/main.cpp src/lib/Chart.cpp -s SAFE_HEAP=1 --bind  -s WASM=1 -O3 -o index.js -s LEGACY_GL_EMULATION=0  -s GL_UNSAFE_OPTS=0 --pre-js pre-module.js --post-js post-module.js -s GL_ASSERTIONS=1 -s INVOKE_RUN=0  -std=c++11 -s USE_WEBGL2=1 -s FULL_ES3=1 -s USE_GLFW=3 -s OFFSCREENCANVAS_SUPPORT=1

谢谢！

Answer 1

#version 300 core适用于 OpenGL 3。WebGL 不支持此功能。

#version 300 es 适用于 OpenGL ES 3。这就是您想要的。