websocketStore.js 1.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104
  1. import Vue from 'vue'
  2. import Vuex from 'vuex'
  3. Vue.use(Vuex)
  4. const store = new Vuex.Store({
  5. state: {
  6. socketTask: null,
  7. websocketData: {}, // 存放从后端接收到的websocket数据
  8. },
  9. mutations: {
  10. setWebsocketData(state, data) {
  11. state.websocketData = data
  12. }
  13. },
  14. actions: {
  15. websocketInit({
  16. state,
  17. dispatch
  18. }, url) {
  19. state.socketTask = uni.connectSocket({
  20. url, // url是websocket连接ip
  21. success: () => {
  22. console.log('WebSocket连接成功!')
  23. },
  24. fail: e => {
  25. console.log('连接失败' + e)
  26. }
  27. })
  28. state.socketTask.onOpen(() => dispatch('websocketOnOpen'))
  29. state.socketTask.onMessage(res => dispatch('websocketOnMessage', res))
  30. state.socketTask.onClose(res => {
  31. state.socketTask == null
  32. console.log('WebSocket连接关闭')
  33. });
  34. state.socketTask.onError(res => {
  35. state.socketTask == null
  36. console.log('WebSocket连接错误')
  37. });
  38. },
  39. websocketOnOpen({
  40. commit
  41. }) {
  42. console.log('WebSocket连接正常打开中...!')
  43. },
  44. // 收到数据
  45. websocketOnMessage({
  46. commit
  47. }, res) {
  48. let data;
  49. try {
  50. data = JSON.parse(res.data)
  51. } catch {
  52. data = {
  53. content: res.data
  54. }
  55. }
  56. commit('setWebsocketData', data);
  57. },
  58. websocketOnClose({
  59. commit,
  60. dispatch
  61. }) {
  62. console.log('WebSocket连接关闭')
  63. },
  64. websocketOnError({
  65. commit,
  66. dispatch
  67. }) {
  68. console.log('WebSocket连接错误')
  69. },
  70. websocketClose({
  71. state
  72. }) {
  73. if (!state.socketTask) return
  74. state.socketTast.close({
  75. success(res) {
  76. console.log('关闭成功', res)
  77. },
  78. fail(err) {
  79. console.log('关闭失败', err)
  80. }
  81. })
  82. },
  83. // 发送数据
  84. websocketSend({
  85. state
  86. }, data) {
  87. uni.sendSocketMessage({
  88. data,
  89. success: res => {
  90. console.log('发送成功', res)
  91. },
  92. fail: e => {
  93. console.log('发送失败', e)
  94. }
  95. })
  96. }
  97. }
  98. })
  99. export default store