html5 h264 websocket,2.5 在WebSocket中使用HTML5媒体

2.5   在WebSocket中使用HTML5媒体

作为HTML5和Web平台的一部分，WebSocket API可以很好地和所有HTML5特性(feature)配合。这个API所能发送和接收的数据类型广泛地用于传输应用程序数据和媒体。字符串当然可以表示XML和JSON等Web数据格式。二进制类型可以和拖放(Drag-and-Drop)、FileReader、WebGL和Web Audio API等集成。

我们来看看如何结合WebSocket使用HTML5媒体。代码清单2-20展示了一个结合WebSocket使用HTML5媒体的完整客户端应用程序。你可以根据这些代码创建自己的HTML文件。

说明　为了构建(或者只是理解)本书中的例子，你可以选择使用我们创建的虚拟机，这个虚拟机包含了我们在示例中使用的所有代码、程序库和服务器。下载、安装和启动这个虚拟机的说明参见附录B。

代码清单2-20   结合WebSocket使用HTML5媒体的完整客户端应用程序

在你所喜爱的现代浏览器中打开这个文件。在WebSocket连接打开时查看浏览器的JavaScript控制台。图2-1展示了在Mozilla Firefox中客户端应用程序的运行情况。注意，在该图的底部，我们显示了Firebug(一个强大的开发和调试工具，可以从http://getfirebug.com获得)中的JavaScript控制台。

现在，试着将一个图像文件拖放到这个页面上。在完成图像文件的拖放后，应该看到图像显示在网页上，如图2-2所示。注意Firebug对添加到页面的图像文件的显示方式。

说明　websocket.org服务器目前只接受小消息，所以这个例子只适用于小于65 KB的图像文件，但是这个限制可能会变化，你可以在自己的服务器上试验更大的图像。

这个演示程序的绝妙特性因为媒体来源于最终显示它的同一浏览器而被削弱。你可以用AJAX、甚至完全不需要网络就能够实现同样的视觉效果。当客户端或者服务器发送一些媒体数据，由不同的浏览器(甚至是其他数千个浏览器)显示时，情形就变得有趣了。在广播方案中使用的二进制图像数据读取和显示机制与这个简单的“回显”演示相同。

【责任编辑：book TEL：(010)68476606】

点赞 0