使用HTML5 WebSocket实现基于网页的实时视频聊天
有没有人知道怎么在网页应用中用HTML5的WebSocket实现语音/视频通话?
如果能用PHP或Python来实现那就太好了,因为我(不幸的是)现在只会这两种编程语言。
一个好的教程就可以了,或者是一个现成的解决方案,我也可以付费购买。
更新1:
添加了视频,因为这不仅仅是关于音频/语音通话的。
更新2:
第一个HTML5视频会议应用已经创建。请查看我自己的回答。
5 个回答
WebRTC 可能是一个解决方案:http://www.webrtc.org/running-the-demos (目前只有 Chrome Canary 浏览器可以使用,并且需要开启 MediaStream 选项)
可以看看这个演示:https://apprtc.appspot.com(确保你用合适的浏览器观看),还有代码可以查看:http://code.google.com/p/webrtc-samples/source/browse/trunk/apprtc/
我写这段话的原因是... 我买了一个很便宜的安卓平板,无法安装 Skype,也不能用 Vtok,Google Voice 在美国以外的地方也无法使用。我需要找一个基于 HTML5 的解决方案,因为我可以运行 Opera Mobile 12,并且在 http://html5demos.com/ 上运行得很好。
看起来爱立信创造了第一个HTML5视频会议应用。
他们使用的技术:
- 实现了设备元素和流API(设备元素的界面目前是用JavaScript和CSS写的)
- 增加了MediaStreamManager,用来把流的地址和媒体后台的相应处理流程对应起来
- 增加了MediaStreamTransceiver,用来控制相关的媒体处理和传输
- 在WebSocket协议中增加了对二进制数据的支持
YouTube上的视频:超越HTML5:对话语音和视频演示 | 爱立信实验室
不幸的是,爱立信暂时不想分享device_dialog.js
。
如果你想只用HTML5,你需要一个支持HTML媒体捕获草案的浏览器(可以在这里找到),这样才能从麦克风获取原始数据。
一旦你拿到这些数据,就需要通过网络发送它们。使用Websockets是HTML5中一个不错的选择,因为它可以让你和服务器之间快速地传输数据(同时发送本地音频数据和接收远程音频数据)。
既然你提到Python,我建议你看看Twisted的Websockets实现。
你可以让所有的客户端在Websocket服务器上“注册”,使用一个呼叫者ID,这样服务器就知道如何找到特定的呼叫者ID。
然后你的服务器需要一个“邀请”API,让呼叫者1可以“邀请”呼叫者2。
一旦通话建立,每个客户端开始发送音频数据,服务器就能把这些音频数据发送给另一方。
当接收到音频数据时,浏览器需要通过扬声器播放这些音频数据,可能会使用HTML5的音频标签。
为了做到这一点,你可能需要用一个“技巧”:不是让Websocket服务器直接把原始音频数据转发给客户端,而是模拟两个“无限”的文件:
- caller1.wav:从呼叫者1的麦克风捕获的声音
- caller2.wav:从呼叫者2的麦克风捕获的声音
当通话建立后,呼叫者1的浏览器会把caller2.wav添加到audio.src属性中(呼叫者1会通过Websocket被通知这个事件),如果Python服务器在接收到数据时把原始音频数据追加到caller2.wav中,它就会开始播放。
听起来你要做的这个原型很酷!
祝你好运,
Jerome Wagner