DBMNG数据库管理与应用

书籍是全世界的营养品。生活里没有书籍,就好像没有阳光;智慧里没有书籍,就好像鸟儿没有翅膀。
当前位置:首页 > 经验分享 > HTML5

WebSocket简单使用(二) - 客户端

如概念篇中介绍的握手协议,客户端是由浏览器提供了API,所以只要使用JavaScript来简单调用即可,而服务器端是要自己实现的,服务器端将在下个博文来讲。

WebSocket JavaScript 接口定义:

  1. [Constructor(in DOMString url, optional in DOMString protocol)]
  2. interface WebSocket {
  3. readonly attribute DOMString URL;
  4. // ready state
  5. const unsigned short CONNECTING = 0;
  6. const unsigned short OPEN = 1;
  7. const unsigned short CLOSED = 2;
  8. readonly attribute unsigned short readyState;
  9. readonly attribute unsigned long bufferedAmount;
  10.  
  11. // networking
  12. attribute Function onopen;
  13. attribute Function onmessage;
  14. attribute Function onclose;
  15. boolean send(in DOMString data);
  16. void close();
  17. };
  18. WebSocket implements EventTarget;
简单了解下接口方法和属性:
  • readyState表示连接有四种状态:
    CONNECTING (0):表示还没建立连接;
    OPEN (1): 已经建立连接,可以进行通讯;
    CLOSING (2):通过关闭握手,正在关闭连接;
    CLOSED (3):连接已经关闭或无法打开;
  • url是代表 WebSocket 服务器的网络地址,协议通常是”ws”或“wss(加密通信)”,send 方法就是发送数据到服务器端;
  • close 方法就是关闭连接;
  • onopen连接建立,即握手成功触发的事件;
  • onmessage收到服务器消息时触发的事件;
  • onerror异常触发的事件;
  • onclose关闭连接触发的事件;

JavaScript调用浏览器接口实例如下:

  1. var wsServer = 'ws://localhost:8888/Demo'; //服务器地址
  2. var websocket = new WebSocket(wsServer); //创建WebSocket对象
  3. websocket.send("hello");//向服务器发送消息
  4. alert(websocket.readyState);//查看websocket当前状态
  5. websocket.onopen = function (evt) {
  6. //已经建立连接
  7. };
  8. websocket.onclose = function (evt) {
  9. //已经关闭连接
  10. };
  11. websocket.onmessage = function (evt) {
  12. //收到服务器消息,使用evt.data提取
  13. };
  14. websocket.onerror = function (evt) {
  15. //产生异常
  16. };
本站文章内容,部分来自于互联网,若侵犯了您的权益,请致邮件chuanghui423#sohu.com(请将#换为@)联系,我们会尽快核实后删除。
Copyright © 2006-2023 DBMNG.COM All Rights Reserved. Powered by DEVSOARTECH            豫ICP备11002312号-2

豫公网安备 41010502002439号