Vue中websocket ,stomp协议websocket对象存储到全局的问题

问题描述

我在vue中使用stomp.js插件操作websocket,在连接上之后,将stomp的对象存入sessionstorage中,防止用户刷新浏览器而丢失这个对象

问题出现的环境背景及自己尝试过哪些方法

我采取了两种方法:
1、将websocket对象存到window下,这样子做是可以的,代码逻辑,流程都可以走通,但当浏览器刷新时,这个对象会丢失掉。
2、将得到的websocket对象,即stomp对象用JSON.stringify()存储到sessionstorage中,要用的时候JSON.parse()将对象取出但这种方法报错了,从控制台的打印我可以看到我已经将存入sessionstorage的字符串转回了对象,但依然报错, newTag.send is not a function
图片描述

相关代码

// 请把代码文本粘贴到下方(请勿用图片代替代码)
将对象存储进sessionStorage

  let url = 'ws://xxx:9008/websocket',
let stompClient = Stomp.client(url);
 stompClient.connect({'token': token,'courseId':courseId}, function (frame) {
      window.STOMP_CLIENT = stompClient
    let client = JSON.stringify(stompClient)
    sessionStorage.STOMP_CLIENT = client
    }
  )

取出对象使用,报错send is ont a function

  let testTag = sessionStorage.STOMP_CLIENT;
  let newTag = JSON.parse(testTag)
console.log(typeof newTag)
console.log(newTag)
newTag.send('/teamsking/course/sign/start',{'token': token},
  JSON.stringify({
    "bean":beanId,
    "classroomId":classroomId,
    "courseId":courseId,
    "userId":userId
  })
);

你期待的结果是什么?实际看到的错误信息又是什么?

为什么这里会报错呢?按理来说从sessionstorage里取出,转成对象后应该不影响使用的啊?

阅读 4k
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题
宣传栏