最近因为项目需要，研究了下html5 WebSocket，Firefox 旧版要加上Moz做兼容。
在支持WebSocket的浏览器中，在创建socket之后。可以通过onopen（当websocket创建成功时，即会触发onopen事件），onmessage（当客户端收到服务端发来的消息时，会触发onmessage事件，参数evt.data中包含server传输过来的数据），onclose（当客户端收到服务端发送的关闭连接的请求时，触发onclose事件）即onerror（如果出现连接，处理，接收，发送数据失败的时候就会触发onerror事件）四个事件实现对socket进行响应，其中在open以后可使用内置send方法实现信息发送进行通迅。申请一个WebSocket对象，参数是需要连接的服务器端的地址，同http协议使用https://开头一样，WebSocket协议的URL使用ws://开头，另外安全的WebSocket协议使用wss://开头。
示例demo:
- <script type="text/javascript">
- var conn = null;
- //连接
- function openConnection(url) {
- if (window.WebSocket) {
- conn = new WebSocket(url);
- } else if (window.MozWebSocket) {
- conn = new MozWebSocket(url);
- } else {
- alert('您的浏览器不支持WebSocket。');
- return;
- }
- //打开连接
- conn.onopen = function() {
- console.log('开始发送请求Ping...');
- conn.send('Ping...');
- };
- //失败
- conn.onerror = function(error) {
- console.log(error);
- conn.close();
- };
- //返回信息
- conn.onmessage = function(event) {
- var message = event.data; //JSON.parse(event.data);
- console.log('服务器返回：'+message);
- };
- //关闭
- conn.onclose = function(event) {
- var message = event; //JSON.parse(event.data);
- if(message){
- conn.close();
- console.log("关闭连接");
- }
- };
- }
- //断开连接
- function disConnection() {
- if (conn != null) {
- conn.close();
- conn = null;
- }
- }
- //初始化
- window.onload = function() {
- openConnection('ws://echo.websocket.org');
- }
- //关闭页面
- window.onunload = function() {
- disConnection();
- }
- </script>
转载请注明：TUTERM.COM » html中使用websocket实现通过实时通功能
