WebGL 和 HTML 着色器类型答案

【问题标题】：WebGL and HTML shader-typeWebGL 和 HTML 着色器类型
【发布时间】：2011-12-22 15:19:38
【问题描述】：

我在 HTML 文件中声明我的 GLSL ES 着色器程序，使用以下代码：

<script id="shader-fs" type="x-shader/x-fragment">..shader-code..</script>

如learning WebGL 示例中所示。一切正常，但我不明白为什么我应该使用 script 标签的 type 属性。我想知道“x-shader/x-fragment”值是在哪里指定的。是谁做的……W3C、Khronos Group 还是浏览器开发者？有谁能够帮我？谢谢你。

【问题讨论】：

【解决方案1】：

这个想法是浏览器不知道类型'x-shader/x-fragment'。如果您将类型更改为其他类型（如“foo”），您的代码将正常工作。

换句话说，对于如何存储着色器源代码没有标准。但是在编译着色器时，您将需要它作为字符串。

【讨论】：

【解决方案2】：

没有官方组织规定应该将 GLSL 代码放在 "x-shader/x-fragment" 类型的 <script> 标记中。

将 GLSL 代码放在 <script> 标签内的唯一原因是，教程作者认为如果将 GLSL 代码放在 <script> 标签内而不是普通字符串中，他的代码会更简洁。

然而，由于 WebGL 将 GLSL 代码作为字符串值，作者必须编写一个名为 getShader(gl, id) 的辅助函数来从页面中获取脚本标记并将其转换为 javascript 字符串，然后再将其传递给 WebGL。

作者之所以选择类型值为"x-shader/x-fragment"，是因为"x-shader/x-fragment"不是浏览器已知的脚本类型，因此会被浏览器安全地忽略。

【讨论】：