网络编程
位置:首页>> 网络编程>> 网页设计>> HTML5 WebSockets基础使用教程(3)

HTML5 WebSockets基础使用教程(3)

作者:暴风彬彬 来源:彬Go 发布时间:2010-09-21 12:48:00 

标签:HTML5,WebSockets,教程

第五步:WebSocket

事件首先让我们尝试并理解WebSocket事件的概念:

WebSocket事件:

我们将使用三个WebSocket事件:

onopen: 当接口打开时

onmessage: 当收到信息时

onclose: 当接口关闭时

我们如何来实现呢?

首先创建WebSocket对象

var socket = new WebSocket("ws://localhost:8000/socket/server/startDaemon.php");

然后向下面这样检测事件

socket.onopen = function(){ 
    alert("Socket has been opened!"); 
}

当我们收到信息时这样做:

socket.onmessage = function(msg){ 
    alert(msg); //Awesome! 
}

但我们还是尽量避免使用alert,现在我们可以把我们学的东西整合到客户端页面中了。

第六步:JavaScript  

首先我们将代码放到jQuery 的 document.ready函数中,然后我们还要检查用户的浏览器是否支持WebSocket。如果不支持,我们就添加一个链向Chrome浏览器页面的链接。

$(document).ready(function() { 
    if(!("WebSocket" in window)){ 
        $('#chatLog, input, button, #examples').fadeOut("fast"); 
        $('<p>Oh no, you need a browser that supports WebSockets. How about <a href="Google'>http://www.google.com/chrome">Google Chrome</a>?</p>').appendTo('#container'); 
    }else{ 
    //The user has WebSockets 
    connect(); 
    function connect(){ 
        //the connect function code is below 
    } 
});

如你所见,如果用户浏览器支持WebSocket,我们将执行connect()函数。这里是核心功能,我们将开始创建open、close和receive事件。

0
投稿

猜你喜欢

手机版 网络编程 asp之家 www.aspxhome.com