web-socket-handler-imp.js 5.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160
  1. import IIMHandler from "../interface/i-im-handler";
  2. import ImApi from './../../../apis/im'
  3. export default class WebSocketHandlerImp extends IIMHandler {
  4. constructor() {
  5. super();
  6. this._socket = null
  7. this.im_user_id = null
  8. this.options = null
  9. this.timer = null
  10. }
  11. register () {
  12. return ImApi.register({name: 'xu'}).then(res => {
  13. this.im_user_id = res.data.id
  14. return res
  15. })
  16. }
  17. /**
  18. * 创建WebSocket连接
  19. * 如:this.imWebSocket = new IMWebSocket();
  20. * this.imWebSocket.createSocket({url: 'ws://10.4.97.87:8001'});
  21. * 如果你使用本地服务器来测试,那么这里的url需要用ws,而不是wss,因为用wss无法成功连接到本地服务器
  22. * @param options 建立连接时需要的配置信息,这里是传入的url,即你的服务端地址,端口号不是必需的。
  23. */
  24. createConnection({options = this.options}) {
  25. console.log( options.url)
  26. this._socket = wx.connectSocket({
  27. url: options.url,
  28. header: {
  29. 'content-type': 'application/json'
  30. },
  31. method: 'GET',
  32. success: () => {
  33. console.log('成功连接')
  34. },
  35. fail: () => {
  36. console.log('连接失败')
  37. }
  38. });
  39. this.intervalSendMsg()
  40. this.options = options
  41. console.log(this.options, 'options')
  42. this._onSocketOpen();
  43. this._onSocketMessage();
  44. this._onSocketError();
  45. this._onSocketClose();
  46. }
  47. reconnect () {
  48. console.log(this.options, 'this.option')
  49. this._socket = wx.connectSocket({
  50. url: this.options.url,
  51. header: {
  52. 'content-type': 'application/json'
  53. },
  54. method: 'GET'
  55. });
  56. this._onSocketOpen();
  57. this._onSocketMessage();
  58. this._onSocketError();
  59. this._onSocketClose();
  60. console.log('重新连接')
  61. }
  62. _sendMsgImp({content, success, fail}) {
  63. console.log(content, 'content')
  64. this._socket.send({
  65. data: JSON.stringify(content),
  66. success: () => {
  67. success && success({content});
  68. },
  69. fail: (res) => {
  70. console.log(res, 'error')
  71. if (res.errMsg === 'SocketTask.send:fail SocketTask.readyState is not OPEN') {
  72. // 发送消息失败,重新连接socket
  73. this.closeConnection()
  74. this.createConnection({options: this.options})
  75. }
  76. fail && fail(res);
  77. }
  78. });
  79. }
  80. /**
  81. * 关闭webSocket
  82. */
  83. closeConnection() {
  84. console.log('关闭socket')
  85. this._socket && this._socket.close();
  86. }
  87. _onSocketError(cb) {
  88. this._socket.onError((res) => {
  89. // this._isLogin = false;
  90. this._socket = null
  91. console.log('WebSocket连接打开失败,请检查!', res);
  92. })
  93. }
  94. _onSocketClose(cb) {
  95. this._socket.onClose((res) => {
  96. // 1分钟无消息后端自动断开连接,code 1006 需要重连socket
  97. if (res.code === 1006) {
  98. this._socket = wx.connectSocket({
  99. url: this.options.url,
  100. success: (res) => {
  101. console.log('重连成功', res)
  102. },
  103. fail: (err) => {
  104. console.log('重连失败', err)
  105. }
  106. });
  107. return
  108. }
  109. clearInterval(this.timer)
  110. this.timer = null
  111. console.log('WebSocket 已关闭!', res)
  112. });
  113. }
  114. _onSocketOpen() {
  115. ImApi.getContacts(getApp().globalData.userinfo.user_id)
  116. this._socket.onOpen((res) => {
  117. console.log('WebSocket连接已打开!');
  118. });
  119. }
  120. /**
  121. * webSocket是在这里接收消息的
  122. * 在socket连接成功时,服务器会主动给客户端推送一条消息类型为login的信息,携带了用户的基本信息,如id,头像和昵称。
  123. * 在login信息接收前发送的所有消息,都会被推到msgQueue队列中,在登录成功后会自动重新发送。
  124. * 这里我进行了事件的分发,接收到非login类型的消息,会回调监听函数。
  125. * @private
  126. */
  127. _onSocketMessage() {
  128. this._socket.onMessage((res) => {
  129. console.log(res, 'receive msg')
  130. let msg = JSON.parse(res.data);
  131. if (msg.type === 'TYPE_ONE') {
  132. this._receiveListener.forEach(fn => {
  133. fn(msg)
  134. })
  135. // this._receiveListener && this._receiveListener(msg);
  136. }
  137. })
  138. }
  139. intervalSendMsg () {
  140. this.timer = setInterval(() => {
  141. // 定时发消息,免得后端自动断开
  142. this._socket.send({data: JSON.stringify({content: '定时发消息'})})
  143. }, 50000);
  144. }
  145. }