Socket.js 3.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177
  1. class Socket {
  2. constructor(link) {
  3. // 初始化socket
  4. if (link.constructor === WebSocket) {
  5. this.socket = link;
  6. } else {
  7. this.socket = new WebSocket(link);
  8. }
  9. // this.socket.binaryType = 'arraybuffer';
  10. this.doOpen();
  11. // 连接状态的标识符
  12. this.readyState = this.socket.readyState;
  13. // 订阅/发布模型
  14. this._events = {
  15. // 订阅的事件 : 发布的方法
  16. };
  17. // 定时验证的标识符
  18. this.heartBeatTimer = null;
  19. }
  20. // 执行socket并发布事件
  21. doOpen() {
  22. this.afterOpenEmit = [];
  23. // 执行socket连接 并初始化验证请求
  24. this.socket.addEventListener("open", evt => this.onOpen(evt));
  25. // 接收socket数据
  26. this.socket.addEventListener("message", evt => this.onMessage(evt));
  27. // 关闭socket连接
  28. this.socket.addEventListener("close", evt => this.onClose(evt));
  29. // 请求发生错误
  30. this.socket.addEventListener("error", err => this.onError(err));
  31. }
  32. // 发布后通知订阅者
  33. Notify(entry) {
  34. // 检查是否有订阅者 返回队列
  35. const cbQueue = this._events[entry.Event];
  36. if (cbQueue && cbQueue.length) {
  37. for (let callback of cbQueue) {
  38. if (callback instanceof Function) callback(entry.Data);
  39. }
  40. }
  41. }
  42. // 请求数据的方法
  43. onOpen(evt) {
  44. // 每隔20s检查连接
  45. // this.heartBeatTimer = setInterval(() => this.send({
  46. // 'cmd': 'ping',
  47. // 'args': ''
  48. // }), 20000);
  49. // 通知订阅
  50. this.Notify({Event: 'open', Data : evt});
  51. }
  52. /**
  53. * 订阅所有的数据
  54. * @param {array|object} datas 订阅参数集合
  55. */
  56. send(datas) {
  57. if (datas.constructor != Array) {
  58. datas = [datas];
  59. }
  60. for (let item of datas) {
  61. this.socket.send(JSON.stringify(item));
  62. }
  63. }
  64. onMessage(evt) {
  65. try {
  66. // 解析推送的数据
  67. const data = JSON.parse(evt.data);
  68. // 通知订阅者
  69. this.Notify({
  70. Event: 'message',
  71. Data: data
  72. });
  73. } catch (err) {
  74. console.error(' >> Data parsing error:', err);
  75. // 通知订阅者
  76. this.Notify({
  77. Event: 'error',
  78. Data: err
  79. });
  80. }
  81. }
  82. // 添加事件监听
  83. on(name, handler) {
  84. this.subscribe(name, handler);
  85. }
  86. // 取消订阅事件
  87. off(name, handler) {
  88. this.unsubscribe(name, handler);
  89. }
  90. // 订阅事件的方法
  91. subscribe(name, handler) {
  92. if (this._events[name]) {
  93. this._events[name].push(handler); // 追加事件
  94. } else {
  95. this._events[name] = [handler]; // 添加事件
  96. }
  97. }
  98. // 取消订阅事件
  99. unsubscribe(name, handler) {
  100. let start = this._events[name].findIndex(item => item === handler);
  101. // 删除该事件
  102. this._events[name].splice(start, 1);
  103. }
  104. checkOpen() {
  105. return this.readyState >= 2;
  106. }
  107. onClose(evt) {
  108. this.Notify({Event: 'close', Data : evt});
  109. }
  110. onError(err) {
  111. this.Notify({Event: 'error', Data : err});
  112. }
  113. emit(data) {
  114. return new Promise((resolve) => {
  115. this.send(JSON.stringify(data));
  116. this.on('message', function (data) {
  117. resolve(data);
  118. });
  119. });
  120. }
  121. doClose() {
  122. this.socket.close();
  123. }
  124. destroy() {
  125. if (this.heartBeatTimer) {
  126. clearInterval(this.heartBeatTimer);
  127. this.heartBeatTimer = null;
  128. }
  129. this.doClose();
  130. this._events = {};
  131. this.readyState = 0;
  132. this.socket = null;
  133. }
  134. }
  135. export default Socket