websocket2.ts 3.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139
  1. /**
  2. * @module initWebSocket 初始化
  3. * @module websocketonopen 连接成功
  4. * @module websocketonerror 连接失败
  5. * @module websocketclose 断开连接
  6. * @module resetHeart 重置心跳
  7. * @module sendSocketHeart 心跳发送
  8. * @module reconnect 重连
  9. * @module sendMsg 发送数据
  10. * @module websocketonmessage 接收数据
  11. * @module test 测试收到消息传递
  12. * @description socket 通信
  13. * @param {any} url socket地址
  14. * @param {any} websocket2 websocket2 实例
  15. * @param {any} heartTime 心跳定时器实例
  16. * @param {number} socketHeart 心跳次数
  17. * @param {number} HeartTimeOut 心跳超时时间
  18. * @param {number} socketError 错误次数
  19. */
  20. import { getToken } from '@/utils/auth';
  21. import { ElNotification } from 'element-plus';
  22. import useNoticeStore from '@/store/modules/notice';
  23. let socketUrl: any = ''; // socket地址
  24. let websocket2: any = null; // websocket2 实例
  25. let heartTime: any = null; // 心跳定时器实例
  26. let socketHeart = 0 as number; // 心跳次数
  27. const HeartTimeOut = 10000; // 心跳超时时间 10000 = 10s
  28. let socketError = 0 as number; // 错误次数
  29. // 初始化socket
  30. export const initWebSocket = (url: any) => {
  31. if (import.meta.env.VITE_APP_WEBSOCKET === 'false') {
  32. return;
  33. }
  34. socketUrl = url;
  35. // 初始化 websocket2
  36. websocket2 = new WebSocket(url + '?Authorization=Bearer ' + getToken() + '&clientid=' + import.meta.env.VITE_APP_CLIENT_ID);
  37. websocketonopen();
  38. websocketonmessage();
  39. websocketonerror();
  40. websocketclose();
  41. sendSocketHeart();
  42. return websocket2;
  43. };
  44. // socket 连接成功
  45. export const websocketonopen = () => {
  46. websocket2.onopen = function () {
  47. console.log('连接 websocket2 成功');
  48. resetHeart();
  49. };
  50. };
  51. // socket 连接失败
  52. export const websocketonerror = () => {
  53. websocket2.onerror = function (e: any) {
  54. console.log('连接 websocket2 失败', e);
  55. };
  56. };
  57. // socket 断开链接
  58. export const websocketclose = () => {
  59. websocket2.onclose = function (e: any) {
  60. console.log('断开连接', e);
  61. };
  62. };
  63. // socket 重置心跳
  64. export const resetHeart = () => {
  65. socketHeart = 0;
  66. socketError = 0;
  67. clearInterval(heartTime);
  68. sendSocketHeart();
  69. };
  70. // socket心跳发送
  71. export const sendSocketHeart = () => {
  72. heartTime = setInterval(() => {
  73. // 如果连接正常则发送心跳
  74. if (websocket2.readyState == 1) {
  75. // if (socketHeart <= 30) {
  76. websocket2.send(
  77. JSON.stringify({
  78. type: 'ping'
  79. })
  80. );
  81. socketHeart = socketHeart + 1;
  82. } else {
  83. // 重连
  84. reconnect();
  85. }
  86. }, HeartTimeOut);
  87. };
  88. // socket重连
  89. export const reconnect = () => {
  90. if (socketError <= 2) {
  91. clearInterval(heartTime);
  92. initWebSocket(socketUrl);
  93. socketError = socketError + 1;
  94. // eslint-disable-next-line prettier/prettier
  95. console.log('socket重连', socketError);
  96. } else {
  97. // eslint-disable-next-line prettier/prettier
  98. console.log('重试次数已用完');
  99. clearInterval(heartTime);
  100. }
  101. };
  102. // socket 发送数据
  103. export const sendMsg = (data: any) => {
  104. websocket2.send(data);
  105. };
  106. // socket 接收数据
  107. export const websocketonmessage = () => {
  108. websocket2.onmessage = function (e: any) {
  109. if (e.data.indexOf('heartbeat') > 0) {
  110. resetHeart();
  111. }
  112. if (e.data.indexOf('ping') > 0) {
  113. return;
  114. }
  115. useNoticeStore().addNotice({
  116. message: e.data,
  117. read: false,
  118. time: new Date().toLocaleString()
  119. });
  120. ElNotification({
  121. title: '消息',
  122. message: e.data,
  123. type: 'success',
  124. duration: 3000
  125. });
  126. return e.data;
  127. };
  128. };