[HTML5] 关于HTML5（WebGL）的那点事

2013年新春伊始，HTML5的曝光率急速增加，可以预见的是今年HTML5必将随着移动互联网的扩张而大举入侵！作为互联网前沿工作者的我们怎能视而不见！赶紧来认识一下HTML5家族中的主要新成员。

• WebSocket：定义了一套API, 允许网页能够使用WebSocket协议来和远程主机进行双工通信（之前已经介绍过，见《Netty Websocket Server Javascript Client》）。
• WebStorage：定义了一套API, 能够在Web客户端以Key-Value的形式对数据进行持久化存储。
• WebWorkers：定义了一套API，能够允许脚本运行于后台，进行类似于线程化的操作。
• WebSQL：定义了一套API, 能够将数据存储在数据库，并使用类似SQL的方式进行查询。
• WebGL：定义了一套API, 能够允许在网页中的canvas标签中使用类似于Open GL，实际上是一套基于OpenGL ES 2.0的3D图形API。

为了让大家对HTML5的新特性（特别是WebGL）有个比较具体的认识，这里推荐两个比较有趣的HTML5应用（游戏），大家有兴趣可以体验一下。

1、http://nouvellevague.ultranoir.com/

该应用带领我们进入了一个奇幻的3D空间，大家还可以在底部的“CONTROLS”菜单中查看基本操作，还可以在“VIEWS”菜单中切换不同的视角（飞机、飞艇、气球），以下是截图。



2、http://crystalin.dyndns.org:8080/GwtQuake.html

这是Quake2游戏的HTML5版，大家在这里可以体验到在浏览器里玩大型3D射击游戏的感觉（相信不久之后CS也会有HTML5版本了吧），以下是截图。



如果你无法运行以上的HTML5应用（游戏），请先确认你的浏览器是否支持WebGL，目前可用的浏览器有：

• Google Chrome 9+
• Mozilla Firefox 4+
• Safari 5.1+（仅限于Mac OS X操作系统）

同时，你还需要有一块好的显卡，并安装了最新的显卡驱动；这只是使你能够运行WebGL的基本要求，如果想要在一些复杂的应用（游戏）中保证显示效果，那你需要一块更好的显卡。当然，如果你的机器使用的是板载的集成显卡，那么你需要在浏览器中强制开启WebGL支持，以下是开启方法：

1、Google Chrome开启方法

我们需要为Chrome加入一些启动参数（以下具体操作步骤以Windows操作系统为例）。先找到Chrome浏览器的快捷方式，如果没有就创建一个快捷方式（右键点击chrome.exe，选择“创建快捷方式”或者“发送到”→“桌面快捷方式”），右键点击快捷方式，选择属性。在目标框内，双引号的后边，加入以下内容：--enable-webgl --ignore-gpu-blacklist --allow-file-access-from-files，以下是这几个命令的解释。

--enable-webgl：表示开启WebGL支持。
--ignore-gpu-blacklist：表示忽略GPU黑名单，由于一些显卡GPU因为过于陈旧等原因，系统不建议运行WebGL，这个参数可以让浏览器忽略这个黑名单。
--allow-file-access-from-files：表示允许从本地载入资源，如果你不是WebGL的开发者，不需要开发调试WebGL，只是想要看一下WebGL的Demo，可以不添加这个参数。

2、Mozilla Firefox开启方法

Firefox的用户请在浏览器的地址栏输入“about:config”，回车后进行以下步骤：

步骤1：在过滤器（filter）中搜索“webgl”
将webgl.force-enabled设置为true
将webgl.disabled设置为false

步骤2：在过滤器（filter）中搜索“security.fileuri.strict_origin_policy”
将security.fileuri.strict_origin_policy设置为false

然后，关闭目前开启的所有Firefox窗口，重新启动Firefox。其中前两个设置是强制开启WebGL支持，最后一个security.fileuri.strict_origin_policy的设置是允许从本地载入资源，如果你不是WebGL的开发者，不需要开发调试WebGL，只是想要看一下WebGL的Demo，可以不设置此项。

3、Safari开启方法

菜单中找到“属性”或“偏好设置”→“高级”，选中“显示开发菜单”，然后到“开发”菜单，选中“开启WebGL”。

虽然目前也有不少唱衰HTML5的言论，但是我相信这只是小部分保守派的担心，这点声音是完全无法阻止HTML5的蓬勃发展的！我们要知道，一个变革性技术的成熟岂是朝夕可以完成的？一旦时机成熟，HTML5必将给互联网带来革命性的升级，网民们也将体验到HTML5为我们带来的震撼体验！